使用 AngularJS 在 gridview 中选中（选中和取消选中全部）复选框

Question

我正在尝试在网格视图中使用 "AngularJS"[=25= 制作一个简单的 （选中和取消选中全部） ] 但我发现的所有示例都依赖于 ng-repeat，我们将不胜感激。

问题是我使用 (ng-checked) 来实现我的目标，但是当主复选框被选中时，子复选框不会触发 onchange 事件 所以我无法完成根据是否选中子复选框进行一些更改的任务

    var ngGridApp = angular.module('gridApp', []);

   ngGridApp.controller('mainController', ['$scope', function ($scope) {
    $scope.name = "gridCtrl";
    $scope.ids = {};

    $scope.ConLog = function (val) {
        console.log(val);
    };

    $scope.CheckUnCheckAll = function () {
        $scope.$watch('ids', function (newValue, oldValue) {
            $scope.ids = newValue;
        });
    }
 }]);

Js Fiddle Demo

Answer 1

好的，我找到了解决办法。 关键是先填充数组以便稍后使用它，因为我不使用 ng-repeat，所以我需要将我的子复选框绑定到 $scope 第一

var ngGrigApp = angular.module('gridApp', []);

ngGrigApp.controller('mainController', ['$scope', function ($scope) {
    $scope.name = "gridCtrl";
    $scope.ids = [];

    $scope.BindIds = (function () {
        angular.element("input[id*=chkBoxSelected]").each(function () {
            $scope.ids.push({ "value": this.value, "IsChecked": this.checked });
        });
    })();

    $scope.triggerAll = function () {

        angular.forEach($scope.ids, function (obj) {
            if ($scope.chkBoxChief) {
                obj.IsChecked = true;
            }
            else {
                obj.IsChecked = false;
            }
        })
    }
}]);

JS Fiddle Demo