Angular $Scope 服务：它是如何工作的？答案

【问题标题】：Angular $Scope service: How does it work?Angular $Scope 服务：它是如何工作的？
【发布时间】：2013-08-17 16:45:06
【问题描述】：

我已经用 Angular 进行了几个星期的试验，但有点担心我不了解 $scope 服务所使用的魔法。我已经成功地编写了使用 $scope 服务来更新模型/视图的控制器，并且我已经能够编写自己的指令来执行相同的操作。

太神奇了！我只是不明白 $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;
 }]);

【问题讨论】：

你读过docs.angularjs.org/guide/scope吗？
是的，我已阅读文档。我理解范围的概念，我对实现细节感兴趣。例如。 $scope 只是作用域对象的别名，还是为适当的作用域对象提供 getter/setter 方法？

标签： javascript angularjs frameworks scope

【解决方案1】：

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

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

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

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

最后，如果您还没有的话，您可能有兴趣查看understanding Angular scopes 上的这篇文章。 :)

【讨论】：

谢谢！很有帮助。