我正在尝试在Angular2中实现文件资源管理器应用程序.
我的主页组件将包含文件夹和文件列表.
如果我单击列表中的某些文件夹,然后使用单击文件夹的名称作为查询字符串,我应该导航到另一个组件,该组件再次具有其中的进一步文件夹和文件的列表,这可以继续一些更多的嵌套级别.
我希望每个打开的文件夹的路径在url栏中可见(即./Folder1/Folder1.1/Folder1.1.2…so on.)
Folder1 Folder1.1 Folder1.1.1 Folder1.1.2 Folder1.2 Folder2
任何人都可以帮助我实现这一点,因为组件不能用作视图和路由器,我发现很难实现这一点,因为这种几乎无限的嵌套是不允许的.
有没有理由为什么每次点击都需要进入单独的视图?用某种类型的bootstrap breadcrumb代表你遍历文件系统来更新当前视图会不会更简单?
话虽如此,你总是可以这样做.
使用@RouteConfig设置路径:
@RouteConfig([ {path:'/',name:'Home',component:HomeComponent},{path:'/dir/:name',name:'Dir',component:DirComponent} ])
如何将dir名称作为url参数传递的示例:
<a [routerLink]="['Dir',{name:'MyDirectory'}]">Profile</a>
然后在你的DirComponent的构造函数中你可以得到那个参数:
constructor(private params: RouteParams) { let dirName = params.get('name'); }
基本概念是,在您的主要组件中,您可以传递目录名称并将其作为url参数传递给另一个路径.
再一次,我建议重新思考为什么每个目录遍历需要一个单独的路由,但这应该为您提供一个在组件之间传递信息的选项.
我还建议在父/子组件之间共享数据.如果您需要可用于多个组件的数据,那么这可能是另一种选择.