AngularJS class 中的引用属性（ControllerAs 语法）

Question

最近我一直在使用 ControllerAs 语法，但我不确定如何在 $watch.

中从我的控制器更改模型

我的手表是这样的：

$scope.$watch(angular.bind(this, function () {
    return this.allItemsSelected;
}), function (value) {
    //
})

在我看来，我得到了一个名为 pages.selectedItems 的模型。 pages 是我的 PagesController.

的别名

到目前为止，我已经尝试了 $scope.selectedItems、selectedItems 和 this.selectedItems，但都行不通。我也将它包装在 angular.bind 中，但效果不佳。

谁也遇到过这个问题，可以提供解决方案吗？

EDIT

我正在使用 checklist-model 指令，因此 ngRepeat 中的模型是 checklist-model="pages.selectedItems"。 allItemsSelected 变量是来自复选框的模型。如果它是真的，我必须遍历我的数据并将 id 添加到 selectedItems 数组。

Answer 1

请查看下面的内容，我认为它应该符合您的要求。

请注意，对于传递给 $scope.$watch():

的两个函数，您通常需要使用 angular.bind()

angular.module("myModule", ['checklist-model'])
.controller("MyController", ["$scope", function MyController($scope) {
    this.options = ["hello", "goodbye", "bonsoir", "bonne nuit"];

    $scope.$watch(angular.bind(this, function () {
        return this.selectAll;
    }), 
    angular.bind(this, function (value) {
        if (value) {
            this.selectedOptions = angular.copy(this.options);
        }
    }));
}]);

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.min.js"></script>
<script src="//vitalets.github.io/checklist-model/checklist-model.js"></script>
<div ng-app="myModule" ng-controller="MyController as me">
  <div ng-repeat="item in me.options">
    <input type="checkbox" checklist-model="me.selectedOptions" 
           checklist-value="item" /> {{item}}
  </div>
  <div>
    <input type="checkbox" ng-model="me.selectAll" /> Select all
  </div>
  <div ng-repeat="opt in me.selectedOptions">{{opt}}</div>
</div>

编辑： 使用 angular.bind() 的替代方法是将 this 分配给匿名函数之外的变量，然后使用它代替this 在这些函数中：

angular.module("myModule", ['checklist-model'])
.controller("MyController", ["$scope", function MyController($scope) {
    var self = this;

    this.options = ["hello", "goodbye", "bonsoir", "bonne nuit"];

    $scope.$watch(function () {
        return self.selectAll;
    }, function (value) {
        if (value) {
            self.selectedOptions = angular.copy(self.options);
        }
    });
}]);

AngularJS class 中的引用属性（ControllerAs 语法）

Reference property in AngularJS class (ControllerAs syntax)

javascript

angularjs