Angular 4：具有未定义数量的参数的路由规则

发布时间：2020-12-17 18:06:32 所属栏目：安全来源：网络整理

导读：我有一个Angular 4文件浏览器系统,只获取当前文件夹内容.这就像 dropbox网站的行为一样. 期望的行为：我能够在面包屑中显示当前路径. 我想用我的路由规则绑定我的痕迹,如下所示： (我有这个) (我需要这个是相同的) 问题是可能存在无限数量的嵌套文件夹,因此

我有一个Angular 4文件浏览器系统,只获取当前文件夹内容.这就像 dropbox网站的行为一样.

期望的行为：

我能够在面包屑中显示当前路径.

我想用我的路由规则绑定我的痕迹,如下所示：

enter image description here

(我有这个)

enter image description here

(我需要这个是相同的)

问题是可能存在无限数量的嵌套文件夹,因此我无法使用静态路由规则.

如何创建这样的规则,我可以检索未定义数量的参数以获取当前文件路径？

我希望能够直接使用此url启动应用程序：localhost：4200 / files / images / myfolder / test /并检索路径,以便我可以直接获取此特定文件夹.

我做了什么：

我只对文件页面有这个简单的路由规则：

const filesRoutes: Routes = [
  { path: 'files',component: FilePageComponent }
  // I need something like that
  { path: 'files/:folder1/:folder2/[...]',component: FilePageComponent } 
];

我当前文件夹的路径只是一个文件数组：this.stackFolder：Array< MyFile>.这就是我获取面包屑内容的方式.

我已经阅读了有关路由的整个angular.io文档,还阅读了有关添加动态路由规则的一些问题.

解决方法

我花了一点时间为你做一个我的想法的例子

Plunker Example

我认为最好的方法是使用LazyLoading.

>它使您可以进行模块的递归加载.就像文件夹三
>其次,您只能为所有文件夹视图实现一个组件
>这种方法的性能更好,因为您的应用程序不需要在死记硬背之前加载所有模块.
>您可以使用路由参数：id来创建文件夹的正确链接.

看一个例子我希望这可以帮到你

附：我用了一个例子,一个孩子< router-outlet>但我认为你不需要这样做.我只是举例说.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!