I am trying to use $cordovaGeolocation but it give below error. Any one can help?
"Error: [$injector:unpr] Unknown provider: $cordovaGeolocationProvider <- $cordovaGeolocation <- GeoCtrl
I used sample in here
You seem to be missing a little setup. First, download ngCordova.js and include it in your index.html right before all your Angular scripts. Then, include the 'ngCordova' dependency when you declare your app module like this: angular.module('yourAppName', ['ngCordova', ...])
Related
This question already has answers here:
Angularjs minification using grunt uglify resulting in js error
(4 answers)
Closed 4 years ago.
I am using webpack + uglifyjs-webpack-plugin + ng-annotate-webpack-plugin in an angularjs app when doing a build everything seems to be working fine until I hit a piece of code that it is using $filter("currency") or $filter("date"). and the console throws the following error
Error: [$injector:unpr] Unknown provider: eProvider <- e <- $locale <- currencyFilter
Error: [$injector:unpr] Unknown provider: eProvider <- e <- $locale <- dateFilter
another possible reason is because you pack filter files in wrong order, try to pack filter files before the controller files which is using the filter.
I have an app which worked great, until I decided to refactor the code and use Gulp for my project. Here is the error I get:
Error: [$injector:unpr] Unknown provider: _Provider <- _ <- utilsFactory <- storageService <- httpRequestInterceptor <- $http <- $templateFactory <- $view <- $state
Since I'm not sure how to read this error and if they all have an issue or if it's only one of them, here are the two places where I use some of these providers when I start my app:
app.run(function($rootScope, $state, storageService, modalsFactory, appFactory, _) { ... }
And:
angular.module("mediaControl").controller("loginCtrl", function ($state, $translate, authService, utilsFactory, appFactory, storageService) { ... }
In my index.html file, I have:
<!-- inject:js -->
<script src="src/mediaControl.js"></script>
...
<script src="src/login/providers/httpRequestInterceptor.service.js"></script>
...
<script src="src/common/providers/utils.factory.js"></script>
<script src="src/common/providers/storage.service.js"></script>
...
<script src="src/login/login.controller.js"></script>
...
<!-- endinject -->
What I checked/did:
Check if Gulp put all of the necessary js files in index.html and in the good order (seems ok to me)
Check the names of the providers (I didn't change them during the refactoring though)
Try to remove my custom providers from loginCtrl and app.run (I still have the same error when I'm doing this)
I read the documentation and some SO questions, but I don't see anything that I would do wrong, considering that my app worked before the refactoring (which consists in reorganizing my file structure, renaming the files, and starting to rewrite the code using ES6 standards). Any idea about what could be wrong here?
As noticed by #shaunhusain, the lodash provider was missing in my index.html. I fixed my Gulpfile so that the file is injected as well, and it works.
I'm using yeoman generator for scaffolding angular web application with requirejs. Its working fine but when I tried to concat and minifying all the js file into a single file through grunt task runner its started giving me above mentioned error. I've researched online about the issue and common solution is I may be mis-spelled any service injecting in the module or service does not exists, I've cross checked again all the spelling, quotation marks etc everything seems fine but still I'm unable to resolve this issue.
Here is my app.js file where my main module with dependencies is listed.
return angular
.module('arteciateYeomanApp', [
'arteciateYeomanApp.controllers.MainCtrl',
'arteciateYeomanApp.controllers.AboutCtrl',
'arteciateYeomanApp.services.Xhr',
'arteciateYeomanApp.services.Common',
'arteciateYeomanApp.controllers.ArtworkCtrl',
'arteciateYeomanApp.controllers.AddAccountCtrl',
'arteciateYeomanApp.controllers.AddArtgroupCtrl',
'arteciateYeomanApp.controllers.AddArtistCtrl',
'arteciateYeomanApp.controllers.AddArtworkCtrl',
'arteciateYeomanApp.controllers.AddCampaignsCtrl',
'arteciateYeomanApp.controllers.AddGenreCtrl',
'arteciateYeomanApp.controllers.AddInstitutionCtrl',
'arteciateYeomanApp.controllers.AdminSignupCtrl',
'arteciateYeomanApp.controllers.ArtistInfoCtrl',
'arteciateYeomanApp.controllers.DirectUserSignupCtrl',
'arteciateYeomanApp.controllers.ErrorCtrl',
'arteciateYeomanApp.controllers.ForgotPasswordCtrl',
'arteciateYeomanApp.controllers.GroupBuyingCtrl',
'arteciateYeomanApp.controllers.LoginCtrl',
'arteciateYeomanApp.controllers.AdminLoginCtrl',
'arteciateYeomanApp.controllers.ResetPasswordCtrl',
'arteciateYeomanApp.controllers.SignupCtrl',
'arteciateYeomanApp.controllers.UnblockUserCtrl',
'arteciateYeomanApp.controllers.UpdatePasswordCtrl',
'arteciateYeomanApp.controllers.DashboardCtrl',
'ngRoute','ngResource']).config(.....);
here is grunt task which I'm running for minifying the js files.
registering task
grunt.registerTask('dev', ['requirejs' ]);
Here is task running script
requirejs : {
compile : {
options : {
baseUrl : "<%= yeoman.app %>/scripts",
mainConfigFile : "<%= yeoman.app %>/scripts/main.js",
name : "main",
out : "requireArterciate.js"
}
}
}
Please let me know if I'm doing something wrong here.
If you need to minify the angularjs code, then use the following standard format syntax to define the controller and to inject the dependencies. Refer Dependency Injection
angular.module('test').controller('testController', testController);
testController.$inject = ['$scope', '$rootScope'];
function testController($scope, $rootScope) {};
I get an error from Angular:
angular.js:68 Uncaught Error: [$injector:unpr] Unknown provider: utilProvider <- util <- AuthInterceptor <- $http <- $templateFactory <- $view <- $state
I'm trying to localize the error, but I don't understand the meaning of chain of functions that the error message mensions:
utilProvider <- util <- AuthInterceptor <- $http <- $templateFactory <- $view <- $state
Can you explain, what are these guys? What's the order of them? It looks like a dependency stack, but is it right-to-left or left-to-right?
This error stack is to be read Left to Right.
It doesn't necessarily mean error is in the first object, it rather means error occured when trying to use that first object.
Angular generated error stack offers link to previous error, and you can trace your bug to its origin.
If you are developing in Chrome, the link is clickable in console and leads to Angular website where you can see some description of the error and most common causes.
Everything works fine locally but I just can't seem to work out what is going wrong when it is deployed.
It looks like something is missing but all the necessary files are there in the correct order:
bundles.Add(new ScriptBundle("~/bundles/angular").Include(
"~/Scripts/angular.js",
"~/Scripts/angular-resource.js",
"~/Scripts/angular-route.js",
"~/Scripts/angular-aria.min.js",
"~/Scripts/Chart.js",
"~/Scripts/angular-chart.js"
));
It keeps throwing the following error:
Error: [$injector:unpr] Unknown provider: nProvider <- n <- chartBarDirective
http://errors.angularjs.org/1.2.9/$injector/unpr?p0=nProvider%20%3C-%20n%20%3C-%20chartBarDirective
at http://xxxxxxxxxxxxxx/bundles/angular?
I'm not using a directive so this must be an Angular-Chart issue?
Any ideas?