javascript - Angular $Scope 服务 : How does it work?

Question

我已经使用 Angular 进行了几个星期的试验，我有点困扰，因为我不了解 $scope 服务所使用的魔法。我已经成功地编写了使用 $scope 服务来更新模型/ View 的 Controller ，并且我已经能够编写自己的指令来执行相同的操作。

太棒了!我只是不明白 $scope 服务背后发生了什么。当我创建如下所示的内容时，当我对 $scope.newproperty 进行赋值时实际发生了什么？我找不到任何特定于 $scope 服务的文档。

module.controller("menu_ctrl",['$scope','$http',function($scope,$http){
    $scope.newproperty = "Bound to model!" //magic!
}]);

此外，当我在一个指令中创建一个新的链接函数时(下面的示例)，我怎么会突然之间只能使用一个变量访问范围？我假设使用 $scope 或 $apply 服务有一些神奇之处，但我只是猜测。这里的任何帮助将不胜感激。谢谢!

srvcs.directive('directiv', ['$http',function($http) {
   var returnObj = {
   link: function linkfn(scopeVar, instance, attr){
      console.log(scopeVar);
      scopeVar.newproperty = "Also bound to model!" //more magic!
      ...
      ...
      }
   };
   return returnObj;
 }]);

Answer 1

$scope 不是服务本身；它只是应用程序根范围的子范围。所以你应该检查一下 $rootScope service文档。

从技术上讲，作用域是一个原型(prototype)继承自 $rootScope 的对象，它是使用 $new 方法创建的。由于它是一个对象，您只需执行 $scope.property = value; 即可在其上创建新属性。幕后没有 getter/setter 方法。为了更好地理解它，您应该查看 Angular 源代码中的 function $RootScopeProvider()。

因为作用域只是一个对象，您可以在指令中的 link 函数中访问它，就像在 Controller 中一样。不需要魔法。 :)

关于$apply，它也不是一个服务，而是$rootScope服务的一个方法。它所做的只是触发一个摘要循环，以便 Angular 处理当前作用域及其子作用域的观察者。

最后，您可能有兴趣在 understanding Angular scopes 上查看这篇文章，以防你还没有。 :)