Angularjs工厂注入错误答案

【问题标题】：Angularjs factory inject errorAngularjs工厂注入错误
【发布时间】：2016-09-16 01:04:10
【问题描述】：

我正在使用angularJS，当我注入工厂时出现错误：

app.js：

angular.module('myapp', [])

myfactory.js：

angular.module('myapp', [])
.factory('httpService', function($http, $timeout) {

});

控制器：test.js：

angular.module('myapp', [])
.controller('test',  function($scope, $timeout, $sce, $http, httpService) {

  $scope.submit = function() {
  }
});

当我添加 httpService 时出现错误。一切似乎都是正确的，我什至在所有项目中都使用了这个工厂。 错误：

angular.min.js:92 Error: [$injector:unpr] http://errors.angularjs.org/1.2.25/$injector/unpr?p0=httpServiceProvider%20%3C-%20httpService
at Error (native)
at http://localhost:81/chah/assets/js/angularjs/angular.min.js:6:450
at http://localhost:81/chah/assets/js/angularjs/angular.min.js:36:202
at Object.c [as get] (http://localhost:81/chah/assets/js/angularjs/angular.min.js:34:305)
at http://localhost:81/chah/assets/js/angularjs/angular.min.js:36:270
at c (http://localhost:81/chah/assets/js/angularjs/angular.min.js:34:305)
at d (http://localhost:81/chah/assets/js/angularjs/angular.min.js:35:6)
at Object.instantiate (http://localhost:81/chah/assets/js/angularjs/angular.min.js:35:165)
at http://localhost:81/chah/assets/js/angularjs/angular.min.js:67:419
at http://localhost:81/chah/assets/js/angularjs/angular.min.js:54:25

【问题讨论】：

您使用的是哪个版本的 Angular？。
@shushanthp 我在 Angular 1.2.25 和 1.3.9 中都进行了测试

标签： javascript angularjs angularjs-factory angularjs-injector

【解决方案1】：

代码应如下所示：

angular.module('myapp', [])
.factory('httpService', function($http, $timeout) {

});
.controller('test',  function($scope, $timeout, $sce, $http, httpService) {

  $scope.submit = function() {
  }
});

【讨论】：

【解决方案2】：

错误的原因是因为在创建httpService 和controller 时，您使用了setter，即angular.module('myapp', []) 语法用于module，而不是getter 语法。 angular.module('myapp')。 Angular 要求我们只定义一次模块，因此后续的重新定义会导致错误。

所以在app.js 中，定义module：

angular.module('myapp', []) ;

在myfactory.js 中，通过删除, [] 使用getter 语法：

angular.module('myapp')
.factory('httpService', function($http, $timeout) {
});

在test.js:

angular.module('myapp')
.controller('test',  function($scope, $timeout, $sce, $http,  httpService) {

$scope.submit = function() {
}
});

这是docs的链接

【讨论】：

【解决方案3】：

检查错误中的链接 (https://docs.angularjs.org/error/$injector/unpr?p0=httpServiceProvider%20%3C-%20httpService)：

您多次创建模块：

angular.module('myapp', [])

你应该做一次。然后使用不带 []

angular.module('myapp').factory ...
angular.module('myapp').controller ...

【讨论】：

【解决方案4】：

是的，

你正在做的是重新创建你的应用程序

您需要做的是定义一次并继续使用该实例

var app = angular.module('myapp', []);

app.factory('httpService', function($http, $timeout) {

});

app.controller('test',  function($scope, $timeout, $sce, $http, httpService) {

  $scope.submit = function() {
  }
});

或者如果你想检索你的应用，语法是 angular.module('myapp') 这将返回“myapp”，但添加 []，告诉 Angular 创建一个应用程序而不是获取它

【讨论】：

问题中正确提到了不同的js文件，
没关系...您可以定义 window.app = ... 然后继续使用该变量，或者正如我所说，您可以使用 angular.module('myapp') 来获取您的应用程序，但正确的方法，或者至少我喜欢这样做，是继续使用该变量
window 是全局的，如果它不与 IIFE 一起使用
@shushanthp - 那又怎样？只要按照正确的顺序加载单独的文件就没有关系。
是的没关系，但是问题中使用的语法也可以使用，因为涉及到应用程序的模块化，您不必缓存变量