代码之家 › 专栏 › 技术社区 › Learning-Overthinker-Confused

全选复选框在我没有任何记录时默认选中

angularjs javascript

Learning-Overthinker-Confused · 技术社区 · 9 年前

当没有记录时,我检查了“全选”按钮,出现了问题。

以下是我的代码:

<input type="checkbox" ng-model="selectAll" ng-model-options="{getterSetter: true}"/>

 var getAllSelected= function () {
        var selectedItems = $scope.items.filter(function (item) {
            return item.selected;
        });
        return selectedItems.length === $scope.items.length;
    }

    var setAllSelected = function (value) {
        angular.forEach($scope.items, function (item) {
            item.selected = value;
        });
    }

    $scope.selectAll = function (value) {
        if (value !== undefined) {
            return setAllSelected(value);
        } else {
            return getAllSelected();
        }
    }

所以问题是,当我的数据库中没有记录时,条件变为现实 $scope.items

return selectedItems.length === $scope.items.length;

2 回复 | 直到 9 年前

Mayur Agarwal 9 年前

我用以下代码片段尝试了您的代码:

var app = angular.module('app', [])

.controller('ctrl', ['$scope', function($scope) {


$scope.value = false;
$scope.items = [{},{}];

 var getAllSelected= function () {
        var selectedItems = $scope.items.filter(function (item) {
            return item.selected;
        });
        return $scope.items.length != 0 && selectedItems.length === $scope.items.length;
    }

    var setAllSelected = function (value) {
      console.log(value);
        angular.forEach($scope.items, function (item) {
            item.selected = value;
        });
    }

    $scope.selectAll = function (value) {
      console.log(value);
        if (value !== undefined) {
            return setAllSelected(value);
        } else {
            return getAllSelected();
        }
    }
  }]);

  <input type="checkbox" ng-model="selectAll" ng-model-options="{getterSetter: true}"/>

您可以在此处查看: https://plnkr.co/edit/oUjNQGI363SJPMeaWA6A?p=preview

Grady Phillips 9 年前

非常简单的修复,只需添加一个条件以确保长度不为零。

return $scope.items.length != 0 && selectedItems.length === $scope.items.length;

推荐文章

learner · 如果超出限制,AngularJS ui select multiple应显示警报

4 年前

Onyx · 外部和内部div都有ng click,当我单击内部div时,两个ng click都会执行。如何预防?

4 年前

Michlut · Angular JS——从表单上传文件,并作为json对象的一部分与其他数据一起发送

4 年前

jieunbi · 按日期排序数组(最新优先)

4 年前

StackoverflowNinja · 当数字框的值在AngularJS中更改时更改下拉列表的值

4 年前

Stradosphere · 如何防止ng bind html添加结束标记?

8 年前

Celestialchippy · 如果事情是真的,如何创建一个“<a>”链接?

8 年前

a4aravind · Angulari如何使用java驱动程序访问元素?

8 年前

Nicoleta Wilskon · DecodeURIComponent不支持%uxxx编码的组件

8 年前

Nishant Florentin · 在AngularJS中发生ng if、ng show等之后,我该如何做一些动作?

8 年前