控制器参数可以是什么?
控制器参数是依赖项,由 AngularJS 注入器服务注入。它们可以是任何东西。但它们通常是控制器内部使用的服务。
使用参数调用的控制器函数在哪里?
AngularJS 中的控制器以及指令、过滤器、服务和许多其他东西都是函数。但是框架管理了很多何时以及如何调用这些函数。
你称之为关联的东西有一个名字:dependency,如上所述。你所说的魔法是 AngularJS 的依赖注入机制在起作用。
当注入器调用这些函数(控制器和其他函数)时,它会读取参数名称(例如:$scope
or$http
或angularFire
)并搜索具有该名称的注册服务,然后在调用函数时将其作为参数提供。
很简单。您有几种方法可以将您的“依赖项”(由注入器管理的参数)告知注入器。
当您简单地将函数声明为function myCtrl($scope) {}
时,注入器将能够$scope
从参数名称中找到服务。但是如果你缩小JavaScript 代码,注入器将无法再找到服务,因为参数名称将被修改为更小的字符串,如“a”或“x”。为避免此问题,可以使用数组表示法指定要注入的服务名称。在这种情况下,您可以像这样声明您的函数:myCtrl = ['$scope', function($scope) {}]
你会在 AngularJS 世界中看到很多数组符号的使用。现在你开始理解它了。您甚至可以在函数中注入$scope
并angularFire
使用它们与其他名称(不建议更改名称- 此示例用于学习目的):['$scope', 'angularFire', function(skop, af) {}]
- 这样,在函数内部您可以使用 $scope 作为“skop”和 angularFire 作为“AF”。数组中服务的顺序与参数的顺序相匹配。
另一个例子:
var myController = ['$scope', '$resource', '$timeout',
function($scope, $resource, $timeout) {
// this controller uses $scope, $resource and $timeout
// the parameters are the dependencies to be injected
// by AngularJS dependency injection mechanism
}
];
angularFire 在哪里定义?
在firebase 模块中。
正如您现在已经知道的那样,注入器将注入任何东西,只要它的“事物”名称已注册并在其记录中可用。如果有具有该名称的“服务” ,他就能够提供它。
那么,如何建立name => stuff
注射器使用的这个列表呢?
模块就是答案。一个模块只不过是一个name => stuff
. 它位于一个模块中,您可以在其中注册服务、工厂、过滤器、指令等。
仔细查看官方文档中的 Module 方法......几乎所有这些方法都作为参数接收:名称和一些“ stuff ”(其中“stuff”几乎总是一个函数,定义控制器、工厂或指令)。正是所有这些“东西”将通过它们指定的名称变得可注入。
AngularJS 服务,如“$timeout”、“$http”等默认情况下是可用的,因为框架已经加载了ng 模块。
对于其他服务,您需要加载/需要模块。这就是你对ngRouter、firebase等所做的事情......通过加载模块,它的注册内容可用于在你的模块/应用程序中注入。
让我们看一个分步示例:
// An empty module:
var module = angular.module('myModule', []);
// Now, adding an "injectable" constant:
module.constant('niceStuff', { blip: 'blop', blup: 307 });
// We could add a service:
module.service('entityManager', ['$http', function($http){ }]);
// and so on... if I wanted to use "$resource" instead of "$http"
// in the entityManager service above...
// ...I would need to require the ngResource when creating the module above,
// like this: var module = angular.module('myModule', ['ngResource']);
// because "$resource" is not available by default
// NOW, anywhere else, since the code above already ran
// I can use those NAMES as dependencies like this:
// We are creating another module now:
var koolModule = angular.module('km', ['myModule']);
// Note that I am requiring the previous module through its registered name
// Now, anything I've declared in that module
// - just like "ng" (by default) and "firebase" (required) does -
// is available for "injection"!!!
koolModule.controller('koolController',
['niceStuff', 'entityManager', function(niceStuff, entityManager) {
console.log(niceStuff.blip); // 'blop'
console.log(niceStuff.blup + 10); // 317
}]
);
这就是 angularFire 之类的 firebase 东西变得可用的方式!我们做了什么?首先,我们创建了“myModule”,并向其注册了 NAMED 的东西。后来,我们需要为我们的“koolModule”提供“myModule”——这些名称已经在注入器name => stuff
列表中可用。
参数中的fbURL是怎么链接的
正如我们刚刚看到的,大多数模块方法只是注册事物 - 为事物命名,以便以后可以通过这些名称注入和/或使用它们。
当module.value('fbURL', 'https://angularjs-projects.firebaseio.com/')
被调用时,fbURL(和指定的值)被注册到name => stuff
列表中......在这种情况下,名称是“fbURL”,值/东西是 URL 字符串 - 但它可以是任何东西!
有没有一个地方可以让我看到 Angular.js 提供的所有服务,例如 $location 和 $timeout?
是的,API 参考:http ://docs.angularjs.org/api/
注意左侧导航的组织方式......按模块!首先是ng模块,有大量的指令、服务、过滤器等。然后,下面是其他模块(ngRoute、ngResource、ngMock 等),每个模块都包含自己的服务、过滤器或指令......
感谢有机会分享这些想法。我喜欢写它们。