2014-11-06 6 views
0

입력 목록이있는 배열을 관리하려고합니다.

사용자가 마지막 항목이 비어 있지 않은 경우에만 항목을 추가 할 수 있기를 바랍니다. 배열의 변경을 왜 바인딩 할 수 없는지 이해가 안됩니다.

나는 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); 

}); 

답변

1

어레이의 정확한 시계이다

$scope.$watchCollection 
,

그러면 어떤 로직을 적용하기 위해 newVal이 함수로 들어오는 지 확인해야합니다 (배열로 제공됨). 예 : 당신의 plunker 업데이트 여기

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

: http://plnkr.co/edit/tf2SSoWNaXSXaZqvRkQT?p=preview

관련 문제