ng-switchDirectiva AngularJS


Ejemplo

Muestra una sección de HTML, solo si coincide con un cierto valor:

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

Definición y uso

La ng-switchdirectiva le permite ocultar/mostrar elementos HTML según una expresión.

Los elementos secundarios con la ng-switch-whendirectiva se mostrarán si se obtiene una coincidencia; de lo contrario, se eliminarán el elemento y sus elementos secundarios.

También puede definir una sección predeterminada, utilizando la ng-switch-default directiva, para mostrar una sección si ninguna de las otras secciones obtiene una coincidencia.


Sintaxis

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

Compatible con todos los elementos HTML.


Valores paramétricos

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