我有一个带有指令和控制器的AngularJS项目。过了一会儿,当我试图运行它时出现了这个错误:
Error: [$injector:unpr] Unknown provider: bProvider <- b
我搜索了它,找不到任何明显的解决方案,有没有人有线索?
这是我的指示:
'use strict';
var directives = angular.module('adminUiApp.directives.upload', []);
directives.directive('uploadDirective',['$interval', function($interval) {
return {
restrict: 'A',
replace: false,
templateUrl: 'views/upload-directive.html',
controller: function($scope) {
//some code
},
controllerAs: 'UploadCtrl'
};
}]);
directives.directive('uploadFileDirective', [ '$parse', '$timeout', function($parse, $timeout) {
return function(scope, elem, attr) {
var fn = $parse(attr['ngFileSelect']);
elem.bind('change', function(evt) {
});
};
}]);
directives.directive('customPopover', function(){
return {
restrict: 'A',
template:'<span class="glyphicon glyphicon-info-sign"></span>',
link: function (scope, el, attrs) {
scope.label =attrs.popoverLabel;
$(el).popover({
trigger: 'hover',
html:true,
content: attrs.popoverHtml,
placement: attrs.popoverPlacement
});
}
};
});
这是我的app.js
angular
.module('adminUiApp', [
'ngAnimate',
'ngCookies',
'ngResource',
'ngRoute',
'ngSanitize',
'ngTouch',
'adminUiApp.directives.upload',
'adminUiApp.directives.navigation',
'angularFileUpload'
])
.config(['$routeProivder', function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/main.html',
controller: 'MainCtrl'
})
.when('/about', {
templateUrl: 'views/about.html',
controller: 'AboutCtrl'
})
.when('/upload', {
templateUrl: 'views/upload.html',
controller: 'UploadCtrl'
})
.otherwise({
redirectTo: '/'
});
}]);
这是我的控制器:
angular.module('adminUiApp')
.controller('UploadCtrl', ['$scope', '$upload', '$timeout', '$http','$interval' function ($scope, $upload, $timeout, $http, $interval) {
//Some logic
}]);
修改
这是我的adminUiApp.directives.navigation。
var directives = angular.module('adminUiApp.directives.navigation', []);
directives.directive('navDirective', function() {
return {
restrict: 'E',
templateUrl: 'views/nav-directive.html',
controller: function($scope) {
//some code
},
controllerAs: 'tab'
};
});
这是我的AboutCtrl:
angular.module('adminUiApp')
.controller('AboutCtrl',['$scope', function ($scope) {
$scope.awesomeThings = [
'HTML5 Boilerplate',
'AngularJS',
'Karma'
];
}]);
这是我的MainCtrl:
angular.module('adminUiApp')
.controller('MainCtrl',['$scope', function ($scope) {
$scope.awesomeThings = [
'HTML5 Boilerplate',
'AngularJS',
'Karma'
];
}]);
我找到了this建议的解决方案,但据我所知,我已经做到了。我在这里错过了什么吗?
编辑:使用Alexandre Nucera的答案更新了代码,但我收到同样的错误。
解决
由于一些奇怪的原因,我必须在&#34; uploadDirective&#34;的返回语句中将控制器函数内的$ scope和$ interval参数传递给。
var directives = angular.module('adminUiApp.directives.upload', []);
directives.directive('uploadDirective', function() {
return {
restrict: 'A',
replace: false,
templateUrl: 'views/upload-directive.html',
controller:['$scope', '$interval', function($scope, $interval) {
//logic code
}],
controllerAs: 'uploadCtrl'
};
});
答案 0 :(得分:2)
您提供的链接给出了正确答案,您在app.js中错过了一个注入依赖项:
config(['$routeProvider', function ($routeProvider) {
...
}]);
同样在您的指令中,请将此语法用于嵌入式控制器:
controller: ['$scope', function($scope) {
//some code
}]
修改:如果您发现此过程繁琐或无法发现剩余问题,可以使用ngmin
另外,请查看官方文档:https://docs.angularjs.org/tutorial/step_05#controller_a-note-on-minification
编辑2 :由于您在评论中提到了grunt,我假设您使用的是uglify插件。如果你真的找不到问题,你仍然无法在你的grunt文件中禁用修改:
// Project configuration.
grunt.initConfig({
uglify: {
options: {
mangle: false
},
my_target: {
files: {
'dest/output.min.js': ['src/input.js']
}
}
}
});