2013-05-08 9 views
16

Ho un problema nella generazione dinamica di opzioni per un modello radio in ui.bootstrap di angular. Ho pensato che avrei potuto semplicemente ng-repeat su un array, utilizzando il suo contenuto per l'attributo btn-radio in questo modo:UI angolare.I pulsanti di radio di avvio funzionano in modo strano con ng-repeat

//in the controller 
$scope.radioModel = undefined; 
$scope.radioModelButtons = ["a", "b", "c"]; 

//in the html 
<div class="btn-group" > 
    <button ng-repeat="value in radioModelButtons" 
    class="btn" type="button" ng-model="radioModel" 
    btn-radio="'{{value}}'"> 
     {{value}} 
    </button> 
</div> 

sto usando angolare 1.1.4 e 0.3.0 ui.bootstrap.

Here is a jsfiddle of my efforts, come si può vedere, i pulsanti di opzione agiscono in modo indipendente e non influenzano la variabile radioModel.

Grazie!

risposta

25

Questo è come si dovrebbe scrivere il markup:

<button ng-repeat="value in radioModelButtons" 
     class="btn" type="button" ng-model="radio.model" 
     btn-radio="value"> 
      {{value}} 
</button> 

E il jsFiddle di lavoro: http://jsfiddle.net/yMLqz/2/

C'erano 2 problemi nel vostro approccio:

  • btn-radio deve essere usato con AngularJS espressione, e non un valore interpolato
  • ng-repeat è creatin g un nuovo ambito per cui è necessario tenerne conto se si desidera associare a un valore definito su un ambito genitore
+0

Grazie mille: D Ora sto leggendo "The Nuances of Scope Prototypal Inheritance" –