javascript - 为什么 Angular Controller 需要 "$scope"

标签 javascript angularjs function

我通常了解到函数实现可以为函数参数使用任何名称,只要以正确的顺序提供即可。这使得函数从外部世界抽象出来,本地名称对输出没有影响。实现者拥有局部变量的所有权利。然而在 Angular JS 中,拥有类似这样的东西似乎有违直觉:

function Controller($scope)
{
    $scope.name = "Something";
}

如果我把“bar”放在那里而不是“$scope”,我会得到一个错误。这不是我们习惯的正常功能。我相信这与 DI 有关,但谁能解释这个概念?我发现很难将其称为“函数”,因为它依赖于外部世界 - 尤其是参数名称。

如果 DI 是真正的原因,谁能告诉我它是如何被调用的?通常,当我想为测试用例模拟一个对象时,我会想到 DI 做得很好。在这种情况下,DI 扮演什么 Angular 色?

在我遇到的 DI 的正常场景中,传递的参数为函数提供服务,例如 foo displayTime(clock) { clock.something } 。时间只是为功能服务。然而,在这里我发现,$scope 和框架似乎发挥了神奇作用,函数只是作为表达逻辑的声明方式。

编辑:显然 JS minify 破坏了这个功能,我们需要像 How do the function argument names in Angular.js objects connect to other objects? 中那样做

最佳答案

定义 Controller 的一种方法是这样的:

myApp.controller("TestController", ['$scope', function(bar) {
   // now "bar" is actually the scope variable
}]);

angular 如此工作的全部原因是因为它进行依赖注入(inject)的方式。基本上它会寻找依赖项(例如 $scope)并尝试根据变量的名称注入(inject)它们。这意味着如果您将 $scope 命名为不同的名称,那么它会尝试注入(inject)其他项目。 bar 不是 Angular 知道如何注入(inject)的东西,因此您将获得 undefined 值而不是您期望的 $scope

我上面的示例之所以有效,是因为我使用数组将要注入(inject)的变量的名称与变量本身分开。现在你不必使用单词 $scope 但你必须保持变量的顺序相同。 DI 的整个概念太复杂了,无法在一篇简短的文章中解释,所以我建议在 Angular 的网站上阅读更多相关信息:https://docs.angularjs.org/tutorial/step_05

DI 的点( Angular )

如果您想知道 - 为什么要这么麻烦?为什么不自动将 $scope 注入(inject)列表中的第一个变量?答案是 - 灵 active 和定制化。使用 Angular,您可以定义您的服务和工厂,然后将它们注入(inject)您的 Controller 。这使您能够定义共享例程、对象甚至自定义控件,然后根据需要在任意多个 Controller 上使用它们。没有 DI - 这一切都不可能。同样,这些都是非常复杂的概念,所以我建议从“它有效”的信念开始,学习服务,然后你可以回过头来阅读更多关于它的信息。在这一点上,我认为 DI 应该更有意义!

祝你好运!

关于javascript - 为什么 Angular Controller 需要 "$scope",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23807579/

相关文章:

sql-server - 如何使用 select 语句中的函数按日期的月份进行分组

Javascript Regex 不在脚本上工作但在控制台上工作

javascript - 如何在不将 javascript 嵌入到 html 中的情况下使用 onkeypress?

javascript - 在 angularjs 服务中捕获按键 - 元素无关

javascript - Bootstrap 模式对话框中的默认按钮

javascript - Angular : how to iterate through all indices in an array except the final index using ng-repeat

javascript - with() 语句中的函数不接收定义的对象

Java8 : How to replace the bitwise inclusive and ( &) by the function Predicate?

javascript - 在 JavaScript 中解决冲突时出现意外结果

javascript - 根据两个单选按钮显示隐藏的 div