Cambia colore di sfondo con ng-Style

Come posso cambiare il colore di sfondo con lo stile ng?Cambia colore di sfondo con ng-Style

questo Div che ripeterà così quello del colore è da DB. Per la plnkr ho appena fissato i colori, ma nel mio esempio è come questo:

<div class="col-md-offset-0 col-md-2" ng-repeat="type in types" style="margin-bottom:5px;"> 
     <div class='container' divCheckbox ng-style="{'background-color':(isSelected?'{{type.color}}':'#ccc')}> 
      <input type='hidden' ng-model="type.show" /> 
      <div class="label">{{type.name}}</div> 
     </div> 
</div>

e la direttiva:

.directive('divCheckbox', function() { 
      return { 
       restrict: 'A', 
       link: function (scope, el, attr) { 
        scope.isSelected = el.find('input').val() == 'false'; 
        el.on('click', function() { 
         scope.isSelected = !scope.isSelected; 
         scope.$apply(); 
        }); 
       } 
      } 
     });

Heres mia plnkr: http://plnkr.co/edit/onLA8vSbtwQu1OxZrKzT?p=preview

fonte

2015-01-24 Luis

non si può fare ternario condizioni all'interno di un tag e hai un errore dal momento che non hai citato background-color. Devi citarla o usare CamelCase, mentre le condizioni dovrebbero essere impostate nel controller.

Quindi, la correzione è quello di avere una variabile ambito che denota un colore (o l'oggetto pieno stile) e usarlo in questo modo: http://plnkr.co/edit/iYkSa2I1ysZutdkAKkuh?p=preview

UPDATE

Ecco un esempio si potrebbe utilizzare per fai in modo che il tuo codice funzioni con il tuo DB (io sto chiamando JSON esterno qui, ma il principio è lo stesso): http://plnkr.co/edit/Kegs95NNyGGySMDzhQed?p=preview

In questo modo puoi anche recuperare il colore 'selezionato'. Questo è praticamente tutto quello che posso dirti con le informazioni che hai fornito.

fonte

2015-01-24 13:22:18 Shomz

Tks Shomz, solo una questione, come si può accedere dalla direttiva per i dati dal DB (la riga è in ascolto al momento) perché il colore è dal DB "{{}} type.color" – Luis

Prego. Hmmm, idealmente potresti iniettare un servizio nel controller e recuperare i dati in quel modo (semplicemente assegnando il valore del colore a una variabile appropriata che stai usando nella vista). Il servizio sarebbe responsabile per il recupero dei dati dal DB. – Shomz

Shomz, basta cambiarlo in ng-style = "{'background-color' :(isSelected? '{{Type.color}}': '# ccc')} come hai detto tu, ma per qualche motivo non funziona in console non mi danno errori – Luis

-1

youse:

return {backgroundImage:'someimg'};

fonte

2015-11-16 09:44:41

entrambi sono stile diverso. Utilizzare

fonte

2017-01-09 09:46:57

Cambia colore di sfondo con ng-Style

risposta

Problemi correlati