[routerLink]とrouterLinkの相違点

Question

[routerLink]とrouterLinkの違いは何ですか？それぞれを使うときは？

Answer 1

あなたはすべてのディレクティブでこれが表示されます：あなたはブラケットを使用する場合、それはあなたがバインド可能なプロパティ（変数）を渡している意味

。

<a [routerLink]="routerLinkVariable"></a> 

だから、この変数（routerLinkVariable）はクラス内で定義することができ、それは以下のような値が必要です：

export class myComponent { 

    public routerLinkVariable = "/home"; // the value of the variable is string! 

しかし変数とし、あなたはそれダイナミック右にする機会がありますか？

export class myComponent { 

    public routerLinkVariable = "/home"; // the value of the variable is string! 


    updateRouterLinkVariable(){ 

     this.routerLinkVariable = '/about'; 
    } 

どこ括弧なしであなただけの文字列を渡しているとあなたはそれがハードコーディングされています、それを変更することはできません、それはあなたのアプリケーション全体でそのようになるだろうと。

<a routerLink="/home"></a> 

UPDATE：

routerLinkのために特別にブラケットを使用する方法について、他の専門は、あなたがに移動しているリンクに動的パラメータを渡すことができている：だから

新しい変数を追加する

export class myComponent { 
     private dynamicParameter = '129'; 
     public routerLinkVariable = "/home"; 

[routerLink]を更新する

<a [routerLink]="[routerLinkVariable,dynamicParameter]"></a> 

あなたは、このリンクをクリックした場合、それはなる：

<a href="/home/129"></a> 

Answer 2

はあなたが

const appRoutes: Routes = [ 
    {path: 'recipes', component: RecipesComponent } 
]; 

<a routerLink ="recipes">Recipes</a> 

を持っていると仮定それはレシピのハイパーリンクをクリックすると、http://localhost:4200/recipes

にジャンプすることを意味しているとパラメータは1

<a [routerLink] = "['/recipes', parameter]"></a> 

です。

動的パラメータ1をリンクに渡してから、 http://localhost:4200/recipes/1