4.7 ng-switch

La directiva ng-switch es similar a ng-if y como nos podemos imaginar es como el switch de la programación. Es decir que permite que entre varios conjuntos de tags solo esté uno de ellos, borrando los que no cumplen la condición.

Esta directiva realmente está compuesta por 4 distintas:

• ng-switch: Es para indicar que queremos hacer el switch
• on: Como valor de la directiva debemos poner una propiedas del $scope
• ng-switch-when : Se pone en cada uno de los tag que queremos que estén o no estén. Su valor es un literal , no puede ser una expresión del $scope
• ng-switch-default : Si no se cumple ninguna condición de ng-switch-when se muestra el que tenga la directiva ng-switch-default

Veamos un ejemplo:

  <div ng-switch    on="valor">
      <div ng-switch-when="A">Es texto y sólo está si hay una A</div>
      <div ng-switch-when="B">Texto para el valor B</div>
      <div ng-switch-default>Texto para cuando no es ni A ni B</div>
  </div>

• Línea 1: Indicamos que es un switch con la directiva ng-switch. También ponemos la expresión en la directiva on.
• Línea 2: Una posible opción cuando valor valga la letra “A”.
• Línea 3: Si valor no vale ni “A” ni “B” estará este tag.

• ng-switch