Angularjs依赖注入,数组,$ inject,工厂

时间:2014-11-23 22:11:43

标签: angularjs dependencies declaration factory code-injection

我是一个大角度的新手,我想要一些关于依赖注入的亮点。

我做了一些研究,到目前为止,这是我所理解的。

我有2个服务文件(使用工厂):

-mogService.js

angular.module('anglober.services').factory('mogService', ['$http', function($http) {

var mogService = {};

//mogService code here

return mogService;
}]);

-modalService.js

angular.module('anglober.services').factory('modalService', ['$modal',
function ($modal) {

   //modalService code here

}]);

一个控制器文件:

-mogCtrl.js

angular.module('anglober.controllers').controller('mogCtrl', ['$scope', 'mogService','modalService', function ($scope, mogService, modalService) {

//code using mogService and modalService parameters

}]);

据我了解,依赖注入是通过在我的控制器声明中将我的服务作为函数参数的参数传递来完成的,字符串数组在这里,以便在缩小之后,angular仍知道哪个变量是什么。

但是,在测试代码时,modalService变量是未定义的。但是,mogService可以正常识别(只有当我删除对modalService变量的任何调用时)。

我做错了什么? 我读过有关使用$ inject的内容,这是更好的做法,为什么?

我在app.js中声明模块如下:

angular.module('anglober.services', ['ui.bootstrap']);
angular.module('anglober.controllers', []);

var app = angular.module('anglober', ['anglober.controllers', 'anglober.services',  'anglober.directives']);

这是好习惯吗?在一个文件中声明模块及其各自的依赖关系,然后在模块文件中只使用“getters”而没有依赖关系数组参数?

感谢您的时间。

1 个答案:

答案 0 :(得分:0)

对我有用的三个步骤(plunkr):

<强> 1。确保只定义模块的依赖项一次。

确实,检查angular.module('anglober.services', [...]);确实只用第二个参数调用了一次。

同时,请务必在实际服务/控制器/ ...定义之前调用这些行。

<强> 2。连接每个依赖

您应该将'anglober.services'依赖关系添加到'anglober.controllers':最后一个需要modalService,这需要$modal,无论如何它都可以提供角度。

第3。按正确的顺序添加可能缺少的lib要求

首先是jQuery,然后是angular,bootstrap,最后是bootstrap.ui和你的模块。