La valeur dynamique du routerLink de ngFor donnant l'erreur " a obtenu l'interpolation ({{}}) où l'expression était attendue"
j'essaie de mettre le routerLink
valeur dans une directive basée sur un ensemble dynamique d'éléments du composant. Mais une erreur est lancée d'Angular2:
EXCEPTION: Template parse errors:
Parser Error: Got interpolation ({{}}) where expression was expected at column 1 in [ {{item.routerLink}} ] in AppHeader@5:40 ("
<a *ngFor="let item of headerItems" [ERROR ->][routerLink]=" {{item.routerLink}} ">
{{item.text}}
</a>
"): Header@5:40
en-tête.composant.ts
import {Component} from '@angular/core';
import {ROUTER_DIRECTIVES} from '@angular/router-deprecated';
@Component({
selector: 'app-header',
templateUrl: './app/components/header/header.component.html',
directives: [ROUTER_DIRECTIVES]
})
export class AppHeader {
headerItems: Object[] = [];
constructor() {
this.headerItems.push(
{ classes: 'navLink', routerLink: ['/Home'], text: 'Home' }
);
}
}
en-tête.composant.html
<div id="HeaderRegion">
<nav class="nav">
<a *ngFor="let item of headerItems" [routerLink]=" {{item.routerLink}} ">
{{item.text}}
</a>
</nav>
</div>
28
demandé sur
BenR
2016-05-06 20:45:21
4 réponses
Vous ne pouvez pas utiliser []
combinés avec {{}}
le premier ou le dernier
[routerLink]="item.routerLink"
Devrait faire ce que vous voulez.
routerLink="{{item.routerLink}}"
lierait item.routerLink.toString()
routerLink
propriété.
64
répondu
Günter Zöchbauer
2018-04-18 13:57:20
Vous auriez pu trouver la réponse à ce moment-là, pour moi enlevant {{}} résolu la question similaire. Votre code pourrait être
<a *ngFor="let item of headerItems" [routerLink]="item.routerLink">
{{item.text}}
</a>
2
répondu
madhav bitra
2017-01-03 15:47:53
quelque Chose comme ce qui a fonctionné pour nous:
<input type="checkbox" [id]="['btn.botStepState-'+i]" [(ngModel)]="btn.botStepState" name="btn.botStepState-{{i}}" (change)="changeHandler($event)" class="cbx hidden" />
- propriété liant i.e.
[]
[]
pour évaluer les valeurs - fixation des modèles i.e.
[()]
ne rien exiger de spécial - Interpolation i.e.
{{}}
peut être utilisé avec des attributs généraux - liaison d'Événements i.e.
()
a travaillé beaucoup avec les fonctions
1
répondu
student
2017-06-22 08:28:59
Vous pouvez aussi utiliser le code suivant pour passer l'expression avec du texte.
<div *ngFor="let customer of customers">
<a [routerLink]="'customer/'+customer.index">Link</a>
</div>
~Manish
1
répondu
Manish Kumar Gupta
2018-03-28 13:42:11