angular2在模型中存儲routerlink

我正在嘗試在Angular2中創建一個動態樹形菜單。我可以用下面的模板文件angular2在模型中存儲routerlink

<template [ngIf]="menuItem"> 
     <li *ngFor="#item of menuItem" [ngClass]="{active: item.active}"> 
      <a (click)="item.toggle()"><i class="{{item.Icon}}"></i>{{item.Name}} <template [ngIf]="item.Level.length >= 1"><i class="{{item.caret()}}"></i></template></a> 
      <template [ngIf]="item.expanded"><template [ngIf]="item.Level.length >= 1"> 
       <ul my_pages_menu_item [menuItem]="item.Level"></ul> 
      </template></template> 
     </li> 
</template>

和存儲我的菜單在數組此刻

export var ITEMS: MenuItem[] = [ 
    new MenuItem('Kontrollpanelen', '/control', 'fa fa-bar-chart', '', false, false, []), 
    new MenuItem('Min profil', '/profile', 'fa fa-user', '', true, true, [ 
     new MenuItem('Personlig information', '#', '', '', false, false, [ 
      new MenuItem('Omdömen', '#', '', '', false, false, []) 
     ]) 
    ]) 
];

和路由器的配置讓我的菜單出來的頁面上進行如下

@RouteConfig([ 
    {path:'/controlpanel', name: 'ControlPanel', component: ControlPanelComponent, useAsDefault: true}, 
    {path:'/profile', name: 'Profile', component: ProfileComponent}, 
])

但我試圖添加一個[routerLink]到a-tag沒有成功。靜態類型：

<a [routerLink]="['Profile']"></a>

工作，但我不知道在編譯菜單結構。與

<a [routerLink]="{{item.Link}}> 
<a [routerLink]="['{{item.Link}}']>

會不起作用

我的菜單項類看起來如下

export class MenuItem { 
    constructor(public Name:string, 
     public Link:string, 
     public Icon:string, 
     public CssClass:string, 
     public expanded: boolean, 
     public active: boolean, 
     public Level:Array<MenuItem> 
    ) {} 
}

反正是有存儲routerlink類或創建運行時routerlink？

來源

2016-02-09 nks1111

您不能同時使用括號[prop]和=「{{}}」。

這應該工作：

<a [routerLink]="[item.Link]">

來源

2016-02-09 14:34:42

angular2在模型中存儲routerlink

回答

相關問題