ng-switch dans Angular2
Je joue angulaire 2 (actuellement avec la version alpha 26). ng-for
et ng-if
par exemple fonctionnent très bien. Par contre j'ai des problèmes avec ng-switch
. Je ne peux pas le faire fonctionner, c'est à dire rien n'est imprimé. Il me semble que si l'ensemble du modèle est ignoré.
C'est le code de mon composant, qui peut également être trouvé sur github:
import {Item} from "js/types/item";
import {Component, View, NgFor, NgIf, NgSwitch} from "angular2/angular2";
@Component({
selector: "item-details",
properties: [
"item"
]
})
@View({
template: `<span>You selected {{item.name}},</span>
<span [ng-switch]="item.name">
<template [ng-switch-when]="'Bill'">
<span> who is often called Billy.</span>
</template>
<template [ng-switch-when]="'Bob'">
<span> who is often called Bobby.</span>
</template>
<template [ng-switch-default]">
<span>who has no nickname.</span>
</template>
</span>
<div *ng-if="item.subItems">
<h2>Sub items:</h2>
<ul>
<li *ng-for="#subItem of item.subItems">{{subItem.name}}</li>
</ul>
</div>`,
directives: [NgFor, NgIf, NgSwitch]
})
export class ItemDetailsComponent {
item:Item;
}
En gros, c'est un simple composant dans lequel j'ai injecter un élément qui a un name
de la propriété. Le name
que la propriété a une valeur, je peux voir que la ligne <span>You selected {{item.name}},</span>
fonctionne très bien.
Je ne sais pas, pourquoi ça ne marche pas. De ma compréhension, tout devrait être correct. J'ai comparé avec l'angle de repo github, le les tests unitairesetc.
Ce sont les choses que j'ai vérifié et je crois sont ok:
NgSwitch
est importé et injectés viadirectives
- syntaxe est correcte
item
est vraiment disponible (mais peut-être pas dans le contexte deNgSwitch
?)
Juste pour être vraiment sûr, j'ai aussi essayé quelque chose de trivial comme modèle suivant (passage sur une chaîne codée en dur ou un nombre):
<span [ng-switch]="'foo'">
<template [ng-switch-when]="'foo'">
<span> who is often called foo.</span>
</template>
<template [ng-switch-when]="'bar'">
<span> who is often called bar.</span>
</template>
</span>
Et cela ne fonctionne pas non plus, donc ça doit être quelque chose de vraiment basique qui je fais de mal.. je crains que je ne peux pas trouver des exemples ou des extraits de code sur internet. Toute aide serait appréciée, merci d'avance.
source d'informationauteur PzYon
Vous devez vous connecter pour publier un commentaire.
Vous avez besoin d'importer
NgSwitchWhen
etNgSwitchDefault
ajoutez les déclarations d'importation