AngularJS ng-switch instructie

Definitie en gebruik

ng-switch instructie toestaan om HTML-elementen te verbergen/toon op basis van een expressie.

door een ng-switch-when als de instructie een overeenkomstige waarde krijgt, wordt het deel met ng-switch-when sub-elementen van de instructie gebruiken, anders worden deze elementen en hun sub-elementen verwijderd.

Je kunt ook ng-switch-default De instructie definieert een standaarddeel om weer te geven wanneer geen andere delen matchen.

Voorbeeld

Alleen als het een specifieke waarde matches, wordt een deel van de HTML weergegeven:

<div ng-switch="myVar">
  <div ng-switch-when="dogs">
    <h1>Honden</h1>
    <p>Welkom in een wereld van honden.</p>
  </div>
  <div ng-switch-when="tuts">
    <h1>Tutorials</h1>
    <p>Leer van voorbeelden.</p>
  </div>
  <div ng-switch-when="cars">
    <h1>Auto's</h1>
    <p>Lees over auto's.</p>
  </div>
  <div ng-switch-default>
    <h1>Wissel</h1>
    <p>Selecteer een onderwerp uit de keuzelijst om de inhoud van deze DIV te wijzigen.</p>
  </div>
</div>

Probeer het zelf

Syntax

<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>

Alle HTML-elementen ondersteunen.

Parameters

Parameters Beschrijving
expression Expressie, verwijdert elementen zonder overeenkomende items en toont elementen met overeenkomende items.