Question

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

<li ng-repeat="d in data"><input type="checkbox"/>{{$index}}</li>
<button ng-show="checkismorethanone">Save</button>

我无法使用ng-model，因为它会检查所有复选框。我如何知道是否选中了复选框？如果选中任何一个复选框，我想显示保存按钮，或者如果不再选中按钮则隐藏按钮。

Answer 1

您可以这样做：

 <li ng-repeat="d in data"><input type="checkbox" ng-model="d.val"/>{{$index}}</li>
<button ng-show="anyCheckBoxSelected()">Save</button>

这在控制器文件中：

$scope.data = [{val:false, num:1 },{num:2, val: false},{num:3, val:false},{num:4, val:false}];
$scope.anyCheckBoxSelected = function() {
  var checked = $filter("filter")($scope.data , {val:true} );
  return checked.length;
}

这是plnkr，从您的链接分叉： http://plnkr.co/edit/VApxbuEBUljkJDjSusxw

Answer 2

检查演示：Plunker

您需要一个对象，比如results', to store the模型values of your selection. Use ng-model to bind the $ index-th checkbox to结果[$ index]`。

<li ng-repeat="d in data"><input ng-model="results[$index]" value="{{d}}" type="checkbox"/>{{$index}}</li>
<button ng-show="checkismorethanone">Save</button>
{{ results | json }}
<button ng-show="showButton()">Submit</button>

在控制器中，for循环迭代当前选择以检查是否选中了某个复选框。如果选中任何复选框，则ng-show为true。

$scope.results = {};
$scope.showButton = function () {
  for (var key in $scope.results) {
    if ($scope.results[key]) {
      return true;
    }
  }
};

根据results的值，切换提交按钮的状态。

Answer 3

您只需使用一个变量来计算点击次数，

如果复选框为checked increment计数器，则未选中checkbox计数器decrement。

如果counter count大于0，则显示按钮。

// index.html

 <ul >
    <li ng-repeat="d in data" > 
      <input type="checkbox" name="{{$index}}" ng-click="checkboxOnClick($event)" /> {{$index}} 
    </li>
  </ul>
  <button ng-show="checkCount">Save</button>

// app.js var app = angular.module（＆＃39; plunker＆＃39;，[]）;

app.controller('MainCtrl', function($scope) {
  $scope.data = [1,2,3,4];

  $scope.checkCount = 0;

  $scope.checkboxOnClick = function($event){
    if( $event.target.checked){
        $scope.checkCount++;
    }else{
        $scope.checkCount--;
    }

  };

});

检查plnkr，

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

如果选中复选框，则应用表达式＆gt; 1

3 个答案: