Angularjs (versions inférieures à 1.1.5) ne fournit pas la if/else
fonctionnalité. Voici quelques options à considérer pour ce que vous voulez réaliser:
( Passez à la mise à jour ci-dessous (# 5) si vous utilisez la version 1.1.5 ou supérieure )
1. Opérateur ternaire:
Comme suggéré par @Kirk dans les commentaires, la façon la plus propre de le faire serait d'utiliser un opérateur ternaire comme suit:
<span>{{isLarge ? 'video.large' : 'video.small'}}</span>
peut être utilisé quelque chose comme ce qui suit.
<div ng-switch on="video">
<div ng-switch-when="video.large">
<!-- code to render a large video block-->
</div>
<div ng-switch-default>
<!-- code to render the regular video block -->
</div>
</div>
Alternativement, vous pouvez également utiliser, ng-show/ng-hide
mais son utilisation rendra à la fois une grande vidéo et un petit élément vidéo, puis masquera celle qui remplit la ng-hide
condition et affiche celle qui remplit la ng-show
condition. Donc, sur chaque page, vous allez réellement afficher deux éléments différents.
4. Une autre option à considérer est la ng-class
directive.
Cela peut être utilisé comme suit.
<div ng-class="{large-video: video.large}">
<!-- video block goes here -->
</div>
Ce qui précède ajoutera essentiellement une large-video
classe css à l'élément div s'il video.large
est véridique.
5. ng-if
directive:
Dans les versions ci-dessus, 1.1.5
vous pouvez utiliser la ng-if
directive. Cela supprimerait l'élément si l'expression fournie retourne false
et réinsère le element
dans le DOM si l'expression revient true
. Peut être utilisé comme suit.
<div ng-if="video == video.large">
<!-- code to render a large video block-->
</div>
<div ng-if="video != video.large">
<!-- code to render the regular video block -->
</div>