Угловые переключатели UI.Bootstrap действуют странно с ng-repeat

Question

У меня есть проблема, динамически генерирующая параметры для радиомодели в угловом ui.bootstrap. Я думал, что я мог бы просто нг-повторение по массиву, используя его содержимое для атрибута БТН-радио, как так:

//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> 

Я использую угловой 1.1.4 и 0.3.0 ui.bootstrap.

Here is a jsfiddle of my efforts, как вы можете видеть, переключатели действуют независимо и не влияют на переменную radioModel.

Спасибо!

Answer 1

Это, как вы должны написать код:

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

И работая jsFiddle: http://jsfiddle.net/yMLqz/2/

Были 2 проблемы в своем подходе:

• btn-radio следует использовать с AngularJS выражение, а не интерполированное значение
• ng-repeat является креатином g новый масштаб, поэтому вам нужно принять это во внимание, если вы хотите привязать к значению, определенному в родительской области.