作用域在AngularJS中如何工作？

Question

为什么这样有效？

app.controller("ctrl", function($scope){
    $scope.From = "Santa";
    $scope.To = "Claus";
});

为什么不这样做？

app.controller("ctrl", function(scope){
    scope.From = "Santa";
    scope.To = "Claus";
});

这也行不通...

app.controller("ctrl", function($x){
    $x.From = "Santa";
    $x.To = "Claus";
});

据我所知， $scope只是一个参数，对函数是私有的。 更改名称如何使其不起作用？

PS。 我刚刚开始学习AngularJS。

Answer 1

请参考： DOCS

DOCS2

$前缀表示属于Angular核心的变量，参数，属性或方法。

以下所有内容都可以正常运行：

app.controller("ctrl", function($scope){
    $scope.From = "Santa";
    $scope.To = "Claus";
});

app.controller("ctrl",['$scope', function(scope){
    scope.From = "Santa";
    scope.To = "Claus";
}]);

app.controller("ctrl",['$scope', function($x){
    $x.From = "Santa";
    $x.To = "Claus";
}]);

1. 隐式注释-您的第一个示例代码

2. 内联数组注释-您的第二个示例代码

Answer 2

Angular具有三种不同的方式来执行依赖项注入。

方法1：注入数组

在我看来，这是最有用的语法，因为它使开发人员更清楚地了解正在发生的事情。

controllerName.$inject = ['$scope', '$http'];
function controllerName($scope, $http) {
   // code here
}

如您所见，所有依赖项注入的核心是一个附加属性，它告诉angular在函数运行之前需要存在什么东西。 Angular确保将这些服务实例化，然后将它们作为参数提供给函数。 与角度匹配的名称是注入数组中提供的字符串。 使用这种语法，实际的函数参数可以命名为ANYTHING（JavaScript合法），它们将在注入数组的相应位置映射到服务。 $scope可以在参数列表中命名为$x ，并且只要注入数组具有正确的名称，它就可以正常工作。

方法2：注射功能

Angular还具有用于声明“可注入”函数的特定语法。 角度文档列出了哪些功能是可注入的，但仅举几个示例，控制器，服务，指令和组件模板功能是可注入的。 语法如下所示：

['$scope', '$http', function($scope, $http) { // code here }]

如您所见，这与第一种语法类似，不同之处在于它结合了注入列表和函数定义。 前n-1个参数是angular将用于查找要注入的依赖项的字符串，第n个参数是要将这些依赖项注入到的函数。 同样，该函数的参数名称表示NOTHING。 它们映射到数组的前n-1字符串中的相应服务。 这种方法是可靠的，并且对开发人员来说更清晰，但是，我认为随着依赖列表的增加，它开始显得混乱。 而且我不喜欢它会使实际的函数定义模糊不清的事实。 这只是一个偏好问题。

方法3：解释的依赖项名称

如果您未完成上述两项操作，那么angular最好通过假设所提供的自变量与要注入的服务/依赖项的名称相同，来猜测要使用的服务。 因此，它看起来像这样（与您在帖子中输入的语法相同）：

function($scope, $http) { //code here }

使用此方法，angular使用参数的实际名称来解释要注入的依赖项。 该方法看起来不错，简单且干净，但是总之，您永远不要使用此方法。 最重要的原因是它不安全。 一个好的minifier也会“破坏”您的代码，将上面的代码转换为function(a,b) { // code } ，这个角度将无法理解。 缩小符不会接触字符串文字。 另外，如果像您这样的人对变量名实际上很重要这一事实感到困惑，那么它很容易引入错误。

如果您希望第三种方法的清洁度和前两种方法的可靠性，我建议您看一下后处理工具NgAnnotate： https : //github.com/olov/ng-annotate 。 我在所有项目中都使用了它，这是一个救命稻草。

Answer 3

因为$ scope是角度的好东西，所以它可以工作。 在许多预定义的工厂中，服务使用$符号。 例如，您都拥有$ rootscope，$ http等等:)