web-dev-qa-db-ja.com

リピーター内のRouterLink angular 2

routerLinkで提供されるナビゲーションに必要なルートを有効にするconfigがあります。

以下のように実行すると、正常に動作します。

<ul class="nav">
    <li class="nav-item">
        <a class="nav-link" href="#" [routerLink]="['/home']">Home</a>
    </li>
    <li class="nav-item">
        <a class="nav-link" href="#" [routerLink]="['/about']">About</a>
    </li>
</ul>

しかし、このように*ngForリピーター内で使用すると失敗します

<ul class="nav">
    <li class="nav-item" *ngFor="let item of menu">
        <a class="nav-link" href="#" [routerLink]="['{{item.link}}']">{{item.name}}</a>
    </li>
</ul>

Googleで十分に検索しましたが、満足のいく答えを見つけることができませんでした。

どんな助けでも大歓迎です

javascriptangulartypescriptwebangular2-routing
12
Arunkumar Srisailapathi

'{{item.link}}'は必要ありません

item.linkおよび''なしで{{}}のみを使用してください

<ul class="nav">
     <li class="nav-item" *ngFor="let item of menu">
         <a class="nav-link" href="#" [routerLink]="[item.link]">{{item.name}}</a>
     </li>
</ul>

routerLinkを連結する場合

できるよ

[routerLink]="['./page/' + item.id]"
24
Suren Srapyan