Diferença entre [routerLink] e routerLink

Qual é a diferença entre [routerLink] e routerLink ? Como você deve usar cada um?

Author: astro8891, 2016-12-29
Source

2 answers

Vais ver isto em todas as directivas.

Quando você usa parêntesis, isso significa que você está passando por uma propriedade bindable (uma variável).

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

Então esta variável (routerlinkvariável) pode ser definida dentro da sua classe e deve ter um valor como abaixo: 

export class myComponent {

    public routerLinkVariable = "/home"; // the value of the variable is string!
Mas com variáveis, tens a oportunidade de a tornar dinâmica, certo? 
export class myComponent {

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


    updateRouterLinkVariable(){

        this.routerLinkVariable = '/about';
    }
Onde sem parêntesis só se passa uma corda e não se pode mudá-la, é difícil codificá-la e será assim. ao longo da sua aplicação. 
<a routerLink="/home"></a>

Actualizar :

A outra especialidade sobre usar parêntesis especificamente para routerLink é que você pode passar parâmetros dinâmicos para a ligação que está navegando para:

Adicionando assim uma nova variável 

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

A actualizar a [routerLink] 

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

Quando você quiser clicar neste link, ele se tornará: 

  <a href="/home/129"></a>
 74
Author: Milad, 2018-05-01 19:04:19

Assume que tens 

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

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

Significa que se carregar em receitas, a hiperligação irá saltar para {[[6]} http://localhost:4200/recipes

Assume que o parâmetro é 1 

<a [routerLink] = "['/recipes', parameter]"></a>
Isso significa que passar o parâmetro dinâmico, 1 para o link, então você navega para http://localhost:4200/recipes/1
 8
Author: matthew chick, 2017-12-21 05:38:59