AngularJS(v1.6)[$injector:unpr]依赖注入错误求助
解决AngularJS 1.6依赖注入错误:$injector:unpr
嘿,我来帮你搞定这两个AngularJS依赖注入的问题,它们都是典型的依赖名称错误或者未注册导致的:
第一个错误:Unknown provider: nxProvider <- nx <- adminController
这个错误说明Angular找不到名为nx的服务提供者,原因可能有以下几种:
nx是第三方库但未正确引入:
如果nx是某个第三方Angular模块,你需要:- 确保已经在项目中引入了对应的JS文件(比如通过script标签或者模块打包工具);
- 在你的
app模块声明中添加该模块作为依赖,比如:angular.module('app', ['nx']); // 替换成实际的模块名,具体以第三方库文档为准
nx是自定义服务但未创建:
如果nx是你计划自定义的服务,需要先在模块中注册它,比如创建一个factory:(function () { 'use strict'; angular.module('app').factory('nx', nx); function nx() { // 这里编写你的服务逻辑 return { // 暴露给外部调用的方法/属性 }; } })();拼写错误:
检查是不是把服务名称写错了,比如是不是应该是$nx或者其他类似名称,仔细核对你的代码和依赖文档。
第二个错误:Unknown provider: httpProvider <- http <- adminService
这个问题非常明确:你把Angular内置的$http服务写成了http(少了美元符号$)。Angular的内置服务都是以$开头的,必须严格使用正确的名称。
修复步骤:
修改admin.service.js中的注入数组和函数参数,把所有http替换成$http:
(function () { 'use strict'; angular.module('app').factory('adminService', adminService); // 把http改成$http adminService.$inject = ['$http', 'enums', '$state']; // 函数参数也要对应改成$http function adminService($http, enums, $state) { function get(req) { var request = { url: req.url, params: req.params || '' }; // 这里的http.get改成$http.get return $http.get(request).then(function (success) { return success; }, function (error) { if (error.status === -1) { location.href = MyappURL; } console.log(error); return error; }); }; function post(req) { var request = { url: req.url, params: req.params }; // 这里的http.post改成$http.post return $http.post(request).then(function (success) { return success; }, function (error) { return error; }); }; return { get: get, post: post } }; })();
额外小问题:控制器注入参数不匹配
你的adminController注入数组最后包含$state,但函数参数里没有声明,会导致后续依赖顺序错误,需要补上:
adminController.$inject = ['$http', 'nx', '$q', '$rootScope', '$scope', 'adminService', '$state']; // 函数参数添加$state function adminController($http, nx, $q, $rootScope, $scope, adminService, $state) { /** code here **/ }
建议先修复$http的拼写错误,再解决nx的依赖问题,最后确保控制器的注入参数和函数参数完全对应,这样就能解决这些错误了。
内容的提问来源于stack exchange,提问作者webdev
相关产品推荐
相关产品推荐

