取消选中ng-repeat列表中的复选框时禁用按钮

时间:2018-02-12 01:16:55

标签: javascript html angularjs checkbox angularjs-ng-disabled

如果我的ng-repeat上没有选中复选框,我需要禁用一个按钮。

<button class="" data-toggle="modal" data-target="#rejectModal" contenteditable="false" id="delbutton" ng-model="delbutton" ng-disabled="!item.checked">

我的复选框就像这样

<input type="checkbox" name="select" value="checked" ng-model="item.checked"/>

我怎么可能这样做?

1 个答案:

答案 0 :(得分:2)

这是你的问题的plunker。 [https://plnkr.co/edit/AIrKVLedt6mcggvpmJE2?p=preview][1]

控制器:

app.controller('MainCtrl', function($scope) {

  $scope.Items = [
    {checked:false},
  {checked:true},
  {checked:false},
  ];

  $scope.setButtonEnabled = function(itemchecked){
      var isButtonEnabled =false;
      angular.forEach( $scope.Items, function(item){
        if(item && item.checked)
           isButtonEnabled = true;
      });
      return  isButtonEnabled;
  };
});

HTML:

<div ng-repeat="item in Items">
      <input type="checkbox" name="select" value="checked" ng-model="item.checked" ng-change="setButtonEnabled()" />
    </div>
    <br>
    <button  id="delbutton"  ng-disabled="setButtonEnabled()">Submit</button>