Angular - 2.23-Améliorer le ngIf avec une condition Else

Dans le dernier cours, nous avons vu la syntaxe de base du NGIF, qui est la syntaxe que vous allez utiliser la plupart du temps. Cependant, il existe une alternative à cette syntaxe. Parfois, vous avez non seulement la condition "if", mais aussi une condition "else". Ainsi, dans cet exemple, nous pourrions dire que le serveur a été créé et que le serverName est quelque chose avec NGIF. Mais on peut aussi ajouter un bloc else où nous voudrions alors dire qu'aucun serveur n'a été créé.

Maintenant, nous avons supprimé ce texte exact pour la raison que nous ne voulons pas le voir, mais imaginez que nous voulions montrer cette alternative. Donc, aucun serveur n'a été créé, ce pourrait être le texte ici, et maintenant nous voulons montrer ce paragraphe seulement si NGIF n'est pas vrai ou si la condition "serverCreated" n'est pas vraie. Nous pouvons réaliser cela en plaçant une référence locale sur cet élément ici.

La référence locale est quelque chose que je vais approfondir dans la section sur la compréhension des composants et la section sur la liaison de données. Pour l'instant, considérons cet élément comme un marqueur. Je vais donc nommer cet élément "noServer" avec un S majuscule. Et maintenant nous devons changer le paragraphe ici en ng modèle. C'est un composant, une directive d'expédition, avec Angular que vous pouvez utiliser pour marquer des endroits dans le DOM.

Maintenant, je vais rajouter le paragraphe dans ce modèle avec le texte entre les deux, comme ceci. Donc, il s'agit essentiellement du texte que vous voulez produire. Et maintenant avec le ng modèle et le marqueur de références locales nous marquons un certain endroit dans le modèle que l'on veut afficher de manière conditionnelle.

Maintenant pour l'afficher de manière conditionnelle, nous améliorons simplement NGIF en ajoutant aussi else et ensuite noServer. Ce marqueur est donc remplacé dans le ng modèle. Et c'est toute la syntaxe dont nous avons besoin. Si nous sauvegardons ceci, vous voyez qu'aucun serveur n'a été créé et dès que je clique ici, cela est remplacé par le serveur a été créé. C'est donc NGIF else, un petit ajout sympathique dans un cas d'utilisation où vous avez, eh bien, une condition else.

Bien sûr, l'alternative serait toujours d'utiliser simplement NGIF avec la vérification inversée, donc si le serveur de points d'exclamation est créé. Mais c'est une autre alternative intéressante. Nous allons utiliser ce code dans le projet de cours que nous allons construire. Je voulais juste souligner que cette option existe. L'utilisation du NGIF de cette manière est cependant le cas le plus fréquent.