我想获取具有定义路径的特定模块中的所有路由,并使用 ngFor 遍历它们并在我的组件 html 中创建链接的动态列表。

ng例如(overview.component.html):

<li *ngFor="let item of items; let i = index;">
   <a routerLink="/{route.path}">{route.path}</a>
</li>

模块示例(base.module.ts):
...

const routerConfig = [
  {
    path: '',
    component: BaseComponent,
    children: [
      {
        path: '',
        component: OverviewComponent
      },
      {
        path: 'group-one',
        component: OverviewComponent
      },
      {
        path: 'group-one/:id',
        component: DetailComponent
      },
      {
        path: 'group-two',
        component: OverviewComponent
      },
      {
        path: 'group-two/:id',
        component: DetailComponent
      }
    ]
  }
];

@NgModule({
  imports: [
    RouterModule.forChild(routerConfig)
  ]
  ...
})
export class BaseModule { }

在尝试了 ActivatedRoute、Router 等的各种实验后,我一直无法找到可以使用此信息的对象。

这目前是否可以通过 Angular 2 路由器实现?

我该如何解决这个问题?

最佳答案

这段代码

<a routerLink="/{route.path}">

/{route.path} 从字面上作为路由路径传递

你可能想要
<a [routerLink]="'/' + route.path">

或者
<a routerLink="/{{route.path}}">

为了让 Angular 对表达式求值,绑定(bind)需要恰好具有 []{{}} 之一(永远不要同时使用两者)
[propName]="..."

或者
propName="{{...}}"

后者总是对结果进行字符串化,因此不适合传递对象。

关于javascript - Angular 2 Routes - 是否可以使用 ngFor 从路由创建动态 routerLinks?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/42056680/

10-10 23:42
查看更多