javascript - View 上的数据未与 Controller 绑定(bind)

我是新手AngularJS。我正在尝试使用以下属性创建一个复选框。
    1.选择和取消选择所有其他复选框核心对应于所有复选框
2.如果选中了所有其他复选框，则自动选中所有复选框。如果未选中其他复选框之一，则自动取消选中所有复选框。这是视图中的代码

<div ng-repeat="fence in thisUserFence">
  <label>
    <input type="checkbox" ng-model="fence.status" ng-change="otherCheckbox()">{{fence.name}}
  </label>{{fence.status}}
</div>
<div>
  <label>
    <input type="checkbox" ng-click="checkAll()" ng-model="isAllSelected">All
  </label>{{isAllSelected}}
</div>

控制器中的代码-

$scope.checkAll=function(){
  var checkStatus=!$scope.isAllSelected;
  $scope.isAllSelected=!$scope.isAllSelected;
  console.log($scope.isAllSelected);
  angular.forEach($scope.thisUserFence,function(fence){fence.status=checkStatus;});
}
$scope.otherCheckbox=function(){
  $scope.isAllSelected=$scope.thisUserFence.every(function(item){return item.status;});
  console.log($scope.isAllSelected);
}

上面的逻辑工作正常，直到您选中所有复选框，然后取消选择
任何otherCheckbox。
$ scope.isAllSelected的值在控制台中为false，但在视图中{{isAllSelected}}的值为true。在视图中不更新。

最佳答案

只需像这样更改checkAll方法，就不需要更改方法中isAllSelected的状态，因为它已绑定到复选框模型

    $scope.checkAll=function(){
        angular.forEach($scope.thisUserFence,function(fence) {
                fence.status=$scope.isAllSelected;
                });
          }

在此处查看工作示例https://jsfiddle.net/Lt7aP/7426/