logo标签列表

AngularJS未知的提供者。

angularjs
158

我试图将mongolab示例“定制”以适应我的REST API。现在我遇到了这个错误，我不确定自己做错了什么：

Error: Unknown provider: ProductProvider <- Product
    at Error (unknown source)
    at http://localhost:3000/js/vendor/angular.min.js:28:395
    at Object.c [as get] (http://localhost:3000/js/vendor/angular.min.js:26:180)
    at http://localhost:3000/js/vendor/angular.min.js:28:476
    at c (http://localhost:3000/js/vendor/angular.min.js:26:180)
    at d (http://localhost:3000/js/vendor/angular.min.js:26:314)
这是我的控制器：
function ProductListCtrl($scope, Product) {
  $scope.products = Product.query();
}

这是模块:

angular.module('productServices', ['ngResource']).
    factory('Product', ['$resource', function($resource){
      var Product = $resource('/api/products/:id', {  }, {
        update: { method: 'PUT' }
      });

      return Product;
    }]);
这个错误表示Angular不知道产品工厂，确保首先引用此服务的JS。另外，在声明模块时，请确保明确定义依赖项，因为当文件被最小化时，由于名称混淆，也会出现此错误。有关更多信息，请参阅此文章：http://www.ozkary.com/2015/11/angularjs-minimized-file-unknown-provider.html - ozkary
你可能需要检查routes.js文件，以查看当前URL路径是否已在页面上加载了必要的提供程序。 - shasi kanth
30个回答
3

如果您的服务是在单独的JavaScript文件中定义的，那么另一个可能导致此错误出现的情况就是请确保您引用了该文件！是的，我知道，这是初学者的错误。

3

由于目前在谷歌上“angularjs未知提供者”的搜索排名较高，以下是另一个需要注意的问题。在使用Jasmine进行单元测试时，请确保在您的beforeEach()函数中包含此语句：

module('moduleName');

否则，您的测试中将出现相同的错误。
2

我忘记注入包含所有服务的文件。在初始化应用程序模块时，请记得执行此操作：

angular.module('myApp', ['myApp.services', ... ]);
2
在我的情况下，我使用了一个匿名函数作为angular模块的包装器，就像这样：
(function () {
var app = angular.module('myModule', []);
...
})();

在括号关闭后，我忘记像上面那样再次打开和关闭括号来调用匿名函数。

我知道你在4年前回答了它，但是今天对我很有帮助，谢谢。 - kotAPI
1
由于这个问题是谷歌搜索的首选结果，我会在列表中添加另一个可能的原因。
如果您正在使用的模块在依赖注入包装器上失败，它将提供相同的结果。例如，从互联网复制和粘贴模块可能依赖于underscore.js并尝试在di包装器中注入'_'。如果underscore在您的项目依赖项提供程序中不存在，当您的控制器尝试引用您的模块工厂时，浏览器的控制台日志将显示“未知提供程序”为您的工厂。
1

对我来说，问题在于我创建了一些新的JavaScript文件，这些文件引用了该服务，但Chrome仅看到旧版本。CTRL + F5解决了我的问题。

1
对我来说，问题在于懒加载; 我晚了加载控制器和服务，因此它们在页面加载时（以及Angular初始化时）不可用。我使用了ui-if标签来解决这个问题，但这与问题无关。 解决方案是在页面加载时就加载服务。
1
这里有另一个可能出现此错误的情况：
如果你使用Sublime Text 2和Angular插件，它会生成类似这样的桩代码。
angular.module('utils', [])
.factory('utilFactory', [''
    function() {
        return {

        }
    }
]);

请注意，在“utilFactory”字符串后，数组的第一个元素是空的 ' '。如果您没有任何依赖项，请将其删除，使其像这样：
angular.module('utils', [])
.factory('utilFactory', [
    function() {
        return {

        }
    }
]);
0

以上的答案都对我没用，也许是我做错了什么，但作为一个初学者，这就是我们所做的。

我正在初始化控制器以在 div 中拥有一个列表：

 <div ng-controller="CategoryController" ng-init="initialize()">

然后使用$routeProvider将URL映射到相同的控制器。一旦我删除了ng-init，控制器就可以与路由一起工作。

0
我有同样的问题。我使用 $('body').attr("ng-app", 'MyApp') 替代 <body ng-app="MyApp"> 来引导。
因为我这样做了。
angular.element(document).ready(function () {        
    angular.bootstrap(document, [App.Config.Settings.AppName]);
})

针对架构需求。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接