ng-switchDirective AngularJS


Exemple

Afficher une section de HTML, uniquement si elle correspond à une certaine valeur :

<div ng-switch="myVar">
  <div ng-switch-when="dogs">
    <h1>Dogs</h1>
    <p>Welcome to a world of dogs.</p>
  </div>
  <div ng-switch-when="tuts">
    <h1>Tutorials</h1>
    <p>Learn from examples.</p>
  </div>
  <div ng-switch-when="cars">
    <h1>Cars</h1>
    <p>Read about cars.</p>
  </div>
  <div ng-switch-default>
    <h1>Switch</h1>
    <p>Select topic from the dropdown, to switch the content of this DIV.</p>
  </div>
</div>

Définition et utilisation

La ng-switchdirective vous permet de masquer/afficher des éléments HTML en fonction d'une expression.

Les éléments enfants avec la ng-switch-whendirective seront affichés s'ils obtiennent une correspondance, sinon l'élément et ses enfants seront supprimés.

Vous pouvez également définir une section par défaut, en utilisant la ng-switch-default directive, pour afficher une section si aucune des autres sections n'obtient de correspondance.


Syntaxe

<element ng-switch="expression">
  <element ng-switch-when="value"></element>
  <element ng-switch-when="value"></element>
  <element ng-switch-when="value"></element>
  <element ng-switch-default></element>
</element>

Pris en charge par tous les éléments HTML.


Valeurs des paramètres

Value Description
expression An expression that will remove elements with no match, and display elements with a match.