Question

当我检查单个项目的复选框时，我正在获取绑定在此项目上的数据并将其推送到数组。使用selectAll我没有在数组中获取此数据。

获取已检查项目对象的角度代码。

$scope.selectedOrganisations = [];
$scope.GetSelectedOrganisations = function (checked, organisation)
{

    if(checked)
    {
        $scope.selectedOrganisations.push(organisation);
        $scope.match.organisations.push(organisation.id);
    }  else {
        // remove item
        for(var i=0 ; i < $scope.selectedOrganisations.length; i++) {
            if($scope.selectedOrganisations[i].id == organisation.id){
                $scope.selectedOrganisations.splice(i,1);
                $scope.match.organisations.splice(i,1);
            }
        }
    }
    $scope.totalSelectedOrganisations = $scope.selectedOrganisations.length;
}
$scope.GetSelectedOrganisations();

这是HTML

//This is selectAll snippet outside the repeater
<div class="input-field__checkbox--reverse">
    <input class="input-field__checkbox--input" type="checkbox" id="input-field__checkbox" ng-model="checkedAll">
        <label class="input-field__checkbox--label  input-field__checkbox--label--border" for="input-field__checkbox<% rowNumber %>"></label>
            <span class="selectall">Select all</span>
    </div>
</div>

// HTML Repeater snippet with checkboxes
<div class="list-view__body__row" ng-cloack ng-repeat="(key, organisation) in organisations.results | filter:{ labels : labelName }:true | orderBy:sortType:sortReverse " ng-init="orgIndex = $index" id="<% rowNumber = labelIndex + organisation.id %>">
  <div class="list-view__body__cell">
    <div class="row">
      <div class="col-md-1">
        <div class="input-field__checkbox">
          <input class="input-field__checkbox--input" type="checkbox" id="input-field__checkbox<% rowNumber %>" ng-change="GetSelectedOrganisations(checked, organisation)" ng-model="checked" ng-checked="checkedAll">
          <label class="input-field__checkbox--label  input-field__checkbox--label--border" for="input-field__checkbox<% rowNumber %>"></label>
        </div>
      </div>
      <div class="col-md-3"><a href="javascript:void(0)" class="list__organisationsGuide__name"> <% organisation.name %> </a></div>
      <div class="col-md-3">
        <ul class="list__organisationsGuide__labels">
          <li ng-repeat="label in organisation.labels | orderBy">
            <% label %>
          </li>
        </ul>
      </div>
      <div class="col-md-3"><% organisation.city %></div>
      <div class="col-md-1">
        <div>
          <span ng-repeat="(key, n) in organisation.rating.stars" class="mdi mdi-star"></span>
        </div>
      </div>
    </div>
  </div>
</div>

我如何使用selectAll，所有选定的项ID都在数组$ scope.selectedOrganisations中推送;

Answer 1

而不是变量checkAll添加一个方法checkAll，它循环遍历所有记录，并根据checkAll输入字段的值设置/取消设置它们。类似的东西：

$scope.list = ...
$scope.inputFieldCheckAll = ...

$scope.checkAll = function() {
    for (var i = 0; i < $scope.list.length; i++) {
        $scope.list[i].check = $scope.inputFieldCheckAll;
    }
}

并在支票中：

<input  type="checkbox" ng-model="inputFieldCheckAll" ng-change="checkAll()"></input>

角度选择所有数据绑定

1 个答案: