Angular 2 Routes - 是否可以使用ngFor從路由創建動態routerLinks？

Question

我想在具有已定義路徑的特定模塊中獲取所有路由，並使用ngFor循環遍歷它們並在我的組件html中創建動態鏈接列表。

ngFor示例（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路由器嗎？

我怎么能解決這個問題呢？

Answer 1

這段代碼

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

傳遞/{route.path}字面上作為路徑路徑

你可能要么

<a [routerLink]="'/' + route.path">

要么

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

對於Angular來評估表達式，綁定需要只有[]或{{}} （從不同時）

[propName]="..."

要么

propName="{{...}}"

后者總是將結果字符串化，因此不適合傳遞對象。