Question

我对超级英雄框架AngularJS很新，所以请原谅我的noobness！因此，当我尝试开发一个简单的SPA，允许管理员通过一个填充了选择复选框的表来更改我网站中其他用户的权限时，我遇到了一个问题。我定义了$scope.checked，因此我可以知道管理员选择了多少用户，还$scope.mainCheckBox可以为主要复选框保留正确的CSS类（例如来自Gmail的用户，用于选择所有/无）在三种情况中的每一种情况下：选择所有用户，不选择用户和部分选择。这个简单的逻辑如下：

$scope.updateMainCheckBox = function(){

    if(this.checked==this.users.length) this.mainCheckBox = "qm-icon-checked";
    else if(!this.checked) this.mainCheckBox = "";
    else this.mainCheckBox = "qm-icon-minus";

};

在其他复选框的ng-click事件回调结束时运行此代码，此代码能够正确选择类，但不会将类分配给mainCheckBox。当我将每个this.mainCheckBox更改为$scope.mainCheckBox时，一切顺利，页面的行为与预期一致。

所以，我知道在vanilla中，this是对window对象的引用，但由于AngularJS有自己的事件处理循环，我相信现在情况并非如此。我预计它会成为$scope的引用，因为找到checked和users，但显然不是。{那么，这里发生了什么？而且，是否有更“有棱角”的方式来实现这一点？

Answer 1

你大多是对的 - 在你的函数的情况下，this确实引用了一个范围。但是，它没有提到$scope;相反，它引用了$scope个孩子中的一个。

尝试此操作：添加一些console.log语句以注销$scope变量的ID，然后输入回调中this范围的ID：

$scope.updateMainCheckBox = function(){
  console.log('$scope:', $scope.$id);
  console.log('this:', this.$id);
  // ...
};

您会发现ID不同。这是因为ngRepeat指令创建了一个子范围，它是一个从其父节点原型继承的范围。这意味着当您直接指定该范围内的值时，它不会到达父范围，即$scope。

我高度建议通过"The Nuances of Scope Prototypal Inheritance"阅读优秀（和冗长）Mark Rajcok;它解释了为什么你在儿童范围看到这种看似奇怪的行为。（您还可以找到a copy on the AngularJS wiki。）

这个'这个'真的是对AngularJS上下文中“$ scope”的引用吗？

1 个答案: