2013-12-09 17 views
12

Voglio verificare i dati booleani con ng-switch angolareNg-switch angolare con booleano

questo è il mio codice. ma non sta funzionando

<div ng-switch={{Item.ItemDetails.IsNew}}> 
    <div ng-switch-when="true"> 
     <p class="new fontsize9 fontWeightBold">NEW</p> 
    </div> 
</div> 
    <div ng-switch={{Item.ItemDetails.IsFeatured}}> 
     <div ng-switch-when="true"> 
       <div class="featured"> 
        <p class="fontWeightBold fontsize8">featured</p> 
       </div> 
     </div> 
    </div> 

valori di {{Item.ItemDetails.IsNew}} e {{}} Item.ItemDetails.IsFeatured sono vere o false

+0

ng -switch si aspettava già un'espressione, quindi {{}} avvolgerlo era l'errore qui. – Hafthor

risposta

16

Se sono solo controllando per i valori veri, ng-se sembra più opportuno e riduce la necessità di ulteriori div che contengono il codice, riducendo il campione troppo:

<div ng-if="Item.ItemDetails.IsNew"> 
    <p class="new fontsize9 fontWeightBold">NEW</p> 
</div> 
<div class="featured" ng-if="Item.ItemDetails.IsFeatured"> 
    <p class="fontWeightBold fontsize8">featured</p> 
</div> 

documenti completi a: http://docs.angularjs.org/api/ng.directive:ngIf

+0

Scusa OddEssay ... Nella mia versione ng-if non supportata .. – Isuru

+0

Se non è possibile eseguire l'aggiornamento, ng-show funzionerebbe come una sostituzione in sostituzione. - Altrimenti, è necessario modificare 'ng-switch = {{Item.ItemDetails.IsNew}}' per 'ng-switch =" Item.ItemDetails.IsNew "' (Nessuna parentesi graffa, valore tra virgolette) - Tuttavia, I ' Non sono sicuro che funzionerà come interruttore tende a essere mirato a valutare le stringhe, quindi un valore booleano potrebbe essere stravagante. – OddEssay

+3

Sì OddEasy..without parentesi graffe ng-switch = "Item.ItemDetails.IsNew" è funzionante. Grazie mille ... – Isuru

18

Convertire il boolea n in una stringa:

<div ng-switch="Item.ItemDetails.IsNew.toString()"> 
    <div ng-switch-when="true"> 
+1

Questa risposta non funziona (ng-switch si aspetta un'espressione quindi i manubri non sono necessari), ma l'intento della risposta è in realtà corretto e dovrebbe essere accettato: 'ng-switch-when' richiede una stringa. Se hai un valore booleano nel tuo test 'ng-switch', usare' toString() 'per convertirlo in 'true' o 'false' è la soluzione. – sumizome

+0

Questa risposta ha funzionato per me. –

+0

Questa risposta ha funzionato anche per me. Avevo bisogno di usare 'ng-switch' per evitare un problema di sfarfallio del DOM che stavo avendo usando due opposte istruzioni' ng-if'. 'ng-switch-when =" true "' usato in tandem con 'ng-switch-default' ha aiutato a risolverlo. –

0

Questa sintassi funziona per me:

<div ng-switch="Item.ItemDetails.IsFeatured"> 
    <div ng-switch-when="true">FEATURED ITEM HTML</div> 
    <div ng-switch-default>REGULAR ITEM HTML (not featured)</div> 
    </div> 
1

È necessario rimuovere il {{}} dal ng-interruttore: Cambiare questa <div ng-switch={{Item.ItemDetails.IsNew}}> a <div ng-switch=Item.ItemDetails.IsNew>