This article summarizes all the possible causes of this problem so far, I hope you do not panic when you encounter this problem! Step by step, follow the contents below:
Problem description:
An Unknown provider usually results from not being able to resolve an injected dependency. The reasons are generally as follows:
1. Dependencies are undefined
angular.module('myApp', [])
.controller('MyController', ['myService', function (myService) {
// Do something with myService
}]);
[$Injector: unPR] Unknown Provider [injector: unPR] Unknown provider. If you find an undefined dependency, first define the dependency in advance.
angular.module('myApp', [])
.service('myService', function () { /* ... */ })
.controller('MyController', ['myService', function (myService) {
// Do something with myService
}]);
2. Reuse of Angular.module
angular.module('myModule', [])
.service('myCoolService', function () { /* ... */ });
angular.module('myModule', [])
// myModule has already been created! This is not what you want!
.directive('myDirective', ['myCoolService', function (myCoolService) {
// This directive definition throws unknown provider, because myCoolService
// has been destroyed.
}]);
Repeated use of Angular. Module (‘myModule’, []) in the above code causes Angular to redefine the myModule module, causing an error. The angular.module(‘myModule’, []) syntax is usually used to define a module again. To avoid this problem, use angular.module(‘myModule’) or a variable instead.
angular.module('myModule', []);
.service('myCoolService', function () { /* ... */ });
angular.module('myModule')
.directive('myDirective', ['myCoolService', function (myCoolService) {
// This directive definition does not throw unknown provider.
}]);
or
var app = angular.module('myModule', []);
app.service('myCoolService', function () { /* ... */ });
app.directive('myDirective', ['myCoolService', function (myCoolService) {
// This directive definition does not throw unknown provider.
}]);
3. Inject one Controller as a dependency into another controller
angular.module('myModule', [])
.controller('MyFirstController', function() { /* ... */ })
.controller('MySecondController', ['MyFirstController', function(MyFirstController) {
// This controller throws an unknown provider error because
// MyFirstController cannot be injected.
}]);
In fact, if you want to instantiate controller, you can use the $Controller service (which will be updated later in the blog).
Inject $Scope into a component that is not a Controller or directive
angular.module('myModule', [])
.service('MyController', ['$scope', function($scope) {
// This controller throws an unknown provider error because
// a scope object cannot be injected into a service.
}]);
When this happens, it is also easy to check, just keep in mind that only controller and directive can inject $Scope as a dependency.
5. Error using Angular compressed version
You would use ngStrictDi
Well, I hope this article can help you, in case of this problem do not panic!
Read More:
- [$ injector:unpr ] Unknown provider:–angular.module () function solution
- Angular Error You seem to not be depending on “@angular/core“ and/or “rxjs“. (Fixed)
- Solve angular’s cannot find module ‘@ angular devkit / core’ problem
- AngularJS: Error reports on $injector:modulerr
- When angular4.0 starts the project, an error is reported: the “@ angular / compiler cli” package was not properly installed
- AngularJS–[ng:areq] Argument ‘xxCtrl’ is not a function, got undefined! Error (Fixed)
- No value has been specified for this provider
- Ngif of module in ionic 5 + angular
- The underlying provider failed on open problem solving
- angular.js Error:[$ injector:modulerr ]Why
- Local workspace file (‘angular.json’) could not be found.
- Angular: Program ng failed to run No application is associated
- Provider: SQL network interfaces, error: 25 http://www.itsvse.com/thre
- Question: connecting git team provider failed. See log for details
- The provider is not compatible with the version of Oracle client systems
- No provider available from registry 192.168.124.195:2181 for service cn.sofw
- Angular error – can’t resolve all parameters for []
- PHP error Warning: Unknown: failed to open stream: Permission denied in Unknown on line 0 Fatal error:
- ValueError: Unknown label type: ‘unknown‘
- Node.JS “Cannot enqueue Handshake after invoking quit” Error (Fixed)