Angular2：配置＆＃39;名称＆＃39;与现有路线冲突的名称＆＃39;

Question

我有一些组件，其中一个组件具有动态路由。

动态路线添加为，

let config = [];
for(let i = 0; i < this.pages.length; i++) {
  config.push({
    path: this.pages[i].slug, 
    name : this.pages[i].name, 
    component: AnotherComponent,
  });
}
router.config(config);

只要多次加载具有动态路由的组件，就会再次配置路由并导致配置冲突。

这里是plunk，动态路由使用链接users加载，在导航离开用户后再次点击users将以下显示的错误记录到控制台。

我该如何解决？感谢您对此进行调查。

Answer 1

在添加路线之前检查路线是否存在

for(let i = 0; i < this.pages.length; i++) {
  if(!router.registry.hasRoute(this.pages[i].name, UsersComponent)) {
    config.push({
      path: this.pages[i].slug, 
      name : this.pages[i].name, 
      component: PersonComponent,
      data : {
        name : this.pages[i].name,
        slug : this.pages[i].slug
      }
    });
  }
}

Plunker