我想要做的是通过迭代Angular2中已配置路由的列表来动态构建我的导航。我似乎无法在路由器中找到可以访问已配置路由的任何位置。有人试过这样的事吗?
我查看了Router
的{{1}}属性,但它似乎没有任何可用的东西。
registry
答案 0 :(得分:4)
我还需要动态生成链接。据我了解,问题是路由器没有方法来生成链接,然后手动将它们放入[router-link]
。然而...... but they plan to add them。路由器的队列中有lot of features,希望他们很快添加它们(;
现在我做了这个工作 - 我把routerConfig放在装饰器之外,所以我可以在这个组件中使用它(如果我导出它可能还有其他的):
let routeConfig = [
{ path: '/', name: 'Intro', component: IntroRouteComponent, useAsDefault: true },
...
{ path: '/projects', name: 'Projects', component: ProjectsRouteComponent },
{ path: '/about', name: 'About', component: AboutRouteComponent },
];
@Component({
directives: [ROUTER_DIRECTIVES],
providers: [],
selector: 'app',
template: `
<a (click)="back()" *ngIf="prevRoute">{{ prevRoute }}</a>
<a (click)="forward()" *ngIf="nextRoute">{{ nextRoute }}</a>
`,
})
@RouteConfig(routeConfig)
export class AppComponent {
private nextRoute: any;
private prevRoute: any;
constructor(private _router: Router) {
this._router.subscribe(route => {
let i = routeConfig.findIndex(r => r.path === ('/' + route));
this.prevRoute = routeConfig[i - 1] ? routeConfig[i - 1].name : false;
this.nextRoute = routeConfig[i + 1] ? routeConfig[i + 1].name : false;
});
}
back() {
this._router.navigate(Array(this.prevRoute));
}
forward(): any {
this._router.navigate(Array(this.nextRoute));
}
}