Dall'archivio script > HTML5

Utilizzo delle direttive ng-if e ng-switch in AngularJS

di Daniele BochicchioDaniele Bochicchio, in HTML5, AngularJS,

Le direttive ng-if e ng-switch consentono facilmente di implementare logica condizionale all'interno del markup, evitando di dover predisporre apposite proprietà all'interno del controller.

ng-if

Grazie a questa direttiva, possiamo semplicemente visualizzare un tag quando l'espressione specificata è verificata:

<label>Nome: <input type="text" ng-model="name" /></label>
<div ng-if="!name">Devi inserire un nome</div>

L'espressione all'interno può essere una qualsiasi condizione e sono supportati anche gli operatori, come nell'esempio.

ng-switch

Un operatore di tipo switch serve quando abbiamo scelte multiple da dover seguire. Ecco un esempio:

<div ng-switch="status">
  <span ng-switch-when="confirmed">Confermato</span>
  <span ng-switch-when="canceled">Annullato</span>
  <span ng-switch-default>Non disponibile</span>
</div>

Si può notare l'uso di ng-switch-default per inserire un comportamento di default, quando nessuno dei valori specificati da ng-switch-when dovesse essere soddisfatto.

Commenti

Visualizza/aggiungi commenti

| Condividi su: Twitter, Facebook, LinkedIn
Aggiorna

Per inserire un commento, devi avere un account.

Fai il login e torna a questa pagina, oppure registrati alla nostra community.

Approfondimenti

I più letti di oggi