Часы AngularJs $ не привязаны

Question

Я пытаюсь управлять массивом со списком ввода.

Я хочу, чтобы пользователь мог добавлять элемент только в том случае, если последний не пуст. Я не понимаю, почему я не могу связать изменение массива.

Я пробовал такой же код полностью в html, но не работает лучше.

Где я ошибаюсь?

Вот plunker: http://plnkr.co/edit/IpivgS5TWNQFFxQlRloa?p=preview

HTML

<div class="row" ng-repeat="radio in radioList track by $index"> 
      <p class="input-group"> 
       <input type="text" class="form-control" ng-model="radio.code" placeholder="enter sthg" ng-required="true" /> 
       <span class="input-group-btn"> 
        <button type="button" class="btn btn-default" ng-click="removeRadioList($index);"><i class="glyphicon glyphicon-remove">X</i> 
        </button> 
       </span> 
      </p> 
     </div> 
    </div> 
    <div class="col-xs-3"> 
     <button class="btn btn-primary" ng-click="addRadioList();" ng-disabled="disableAddRadio">Ajouter un cliché</button> 
     {{radioList[radioList.length-1] }} 
    </div> 

** JS **

$scope.radioList = [{ 
    code: '' 
}]; 
$scope.addRadioList = function() { 
    $scope.radioList.push({ 
     'code': '' 
    }); 
} 
$scope.removeRadioList = function(i) { 
    $scope.radioList.splice(i, 1); 
} 

$scope.$watch('radioList', function(newValue, oldValue) { 
    console.log('change'); 
    $scope.disableAddRadio = (angular.isDefined($scope.radioList[$scope.radioList.length - 1].code) || $scope.radioList.length < 1); 

}); 

Answer 1

Правильный часы для массива:

$scope.$watchCollection 

Затем вы должны проверить, что newVal входит в функцию, чтобы применить некоторую логику (поступающую как массив). Пример:

if (newValue.length > 1 && newValue[newValue.length-2].code === undefined) $scope.disableAddRadio = true; 

Вот ваш plunker обновление: http://plnkr.co/edit/tf2SSoWNaXSXaZqvRkQT?p=preview