I am trying to use $resouce for REST API call, but i am getting below error.
Uncaught Error: [$injector:modulerr] Failed to instantiate module starter due to:
Error: [$injector:modulerr] Failed to instantiate module starter.services due to:
Error: [$injector:modulerr] Failed to instantiate module $resource due to:
Error: [$injector:nomod] Module '$resource' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.5.3/$injector/nomod?p0=%24resource
at http://localhost:8080/stockpicker/stockPickerApp/www/lib/ionic/js/ionic.bundle.js:13438:12
at http://localhost:8080/stockpicker/stockPickerApp/www/lib/ionic/js/ionic.bundle.js:15404:17
at ensure (http://localhost:8080/stockpicker/stockPickerApp/www/lib/ionic/js/ionic.bundle.js:15328:38)
at module (http://localhost:8080/stockpicker/stockPickerApp/www/lib/ionic/js/ionic.bundle.js:15402:14)
at http://localhost:8080/stockpicker/stockPickerApp/www/lib/ionic/js/ionic.bundle.js:17894:22
at forEach (http://localhost:8080/stockpicker/stockPickerApp/www/lib/ionic/js/ionic.bundle.js:13691:20)
at loadModules (http://localhost:8080/stockpicker/stockPickerApp/www/lib/ionic/js/ionic.bundle.js:17878:5)
at http://localhost:8080/stockpicker/stockPickerApp/www/lib/ionic/js/ionic.bundle.js:17895:40
at forEach (http://localhost:8080/stockpicker/stockPickerApp/www/lib/ionic/js/ionic.bundle.js:13691:20)
at loadModules (http://localhost:8080/stockpicker/stockPickerApp/www/lib/ionic/js/ionic.bundle.js:17878:5)
below is my index.html where i have included angular.js and angular-resouce.js
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="lib/ionic-platform-web-client/dist/ionic.io.bundle.min.js"></script>
<script type="text/javascript" src="lib/ionic/js/angular/angular-resource.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/services.js"></script>
</head>
<body ng-app="starter">
...
...
below is the content from my app.js
angular.module('starter', [ 'ionic', 'ionic.service.core', 'starter.controllers', 'starter.services','ngResource'])
.run(function($ionicPlatform) {
Content from service.js
angular.module('starter.services', ['$resource']).factory('StockPickerService', function($http,$resource) {
// Might use a resource here that returns a JSON array
Am i missing anything ?
Inject ngResource in module starter.services, not $resource.
angular.module('starter.services', ['ngResource']).factory('StockPickerService', function($http,$resource) {
// Might use a resource here that returns a JSON array
ngResource is the module that provides the $resource service.
So
angular.module('starter.services', ['ngResource']).factory('StockPickerService', function($http,$resource) { }
should work
Related
inside index.html
<script src="../node_modules/howler/dist/howler.js" type="text/javascript"></script>
inside app.js
angular.module('starter', ['ionic', 'ngCordova', 'ion-gallery', 'ngKookies',
'chart.js', 'angularjs-gauge', 'mediaPlayer', 'ang-drag-drop', 'Howler']);
when using HOWL
var sound = new Howl({
src: ['sound.webm', 'sound.mp3']
});
this code gives following error
Error: [$injector:modulerr] Failed to instantiate module Howl due to:
Error: [$injector:nomod] Module 'Howl' is not available! You either misspelled the
module name or ...
<script src="../node_modules/howler/dist/howler.js"
type="text/javascript"></script>
Insted of getting howler.js from the node modules user need to define howlerjs cdn inside the index file
<script
src="https://cdnjs.cloudflare.com/ajax/libs/howler/2.1.3/howler.js">
</script>
In html I am loading the oclazyload before my app.js -
<!-- inject:js -->
<script src="/packages/libs/jquery/dist/jquery.js"></script>
<script src="/packages/libs/angular/angular.js"></script>
<script src="/packages/libs/oclazyload/dist/ocLazyLoad.js"></script>
<script src="/packages/libs/angular-ui-router/release/angular-ui-router.js"></script>
<!-- endinject -->
<script src="app/app.js" ></script>
<script src="app/common/app.config.js" charset="utf-8"></script>
My app.js -
(function () {
angular.module('app', ['ui.router', 'oc.lazyload']);
angular.element(document).ready(function () {
angular.bootstrap(document, ["app"]);
});
})();
But for some reason it doesn't load the oc.lazyload module at all . what might be the problem ? Am I missing something ?
Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:
Error: [$injector:modulerr] Failed to instantiate module oc.lazyload due to:
Error: [$injector:nomod] Module 'oc.lazyload' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
There is a typo. The module name is camel case. Change
'oc.lazyload'
to
'oc.lazyLoad' //'L' capitalized
The dependency for oc lazyload should be added as oc.lazyLoad instead of oc.lazyload
app.js
(function () {
angular.module('app', ['ui.router', 'oc.lazyLoad']);
angular.element(document).ready(function () {
angular.bootstrap(document, ["app"]);
});
})();
Reference
I also had this error, even though I did not have any typos and I followed the configuration directions at https://oclazyload.readme.io/docs. I was using Angular within Ruby on Rails, and my error was fixed by adding the line below to my app/assets/javascripts/application.js file:
//= require oclazyload
I have the following problem.
Here's my angular app defenition:
angular.module('app', [
'ui.router',
'ui.utils',
'ngCookies',
'oc.lazyLoad'
]);
Here's part of my main html file:
<!-- ANGULAR -->
<script src="assets/plugins/angular/angular.js" type="text/javascript"></script>
<script src="assets/plugins/angular-ui-router/angular-ui-router.min.js" type="text/javascript"></script>
<script src="assets/plugins/angular-ui-util/ui-utils.min.js" type="text/javascript"></script>
<script src="assets/plugins/angular-sanitize/angular-sanitize.min.js" type="text/javascript"></script>
<script src="assets/plugins/angular-oc-lazyload/ocLazyLoad.min.js" type="text/javascript"></script>
<!--ngCookies-->
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular-cookies.js" type="text/javascript"></script>
So I supposed I've done all I need to do to use $cookieStore. And yet, when I run my app, I see a blank browser window, and in console:
Error: [$injector:modulerr] Failed to instantiate module app due to:
[$injector:modulerr] Failed to instantiate module ngCookies due to:
[$injector:nomod] Module 'ngCookies' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.3.15/$injector/nomod?p0=ngCookies
minErr/<#file:///D:/Webstorm/Magic/assets/plugins/angular/angular.js:63:12
module/<#file:///D:/Webstorm/Magic/assets/plugins/angular/angular.js:1774:1
ensure#file:///D:/Webstorm/Magic/assets/plugins/angular/angular.js:1698:38
module#file:///D:/Webstorm/Magic/assets/plugins/angular/angular.js:1772:1
loadModules/<#file:///D:/Webstorm/Magic/assets/plugins/angular/angular.js:4115:22
forEach#file:///D:/Webstorm/Magic/assets/plugins/angular/angular.js:323:11
loadModules#file:///D:/Webstorm/Magic/assets/plugins/angular/angular.js:4099:5
loadModules/<#file:///D:/Webstorm/Magic/assets/plugins/angu
Can anyone tell me what did I forget to do?
Things you could try:
Add http:// to the src
Try downloading with bower then add it like the rests
I am running Ionic and trying to use cordovaHTTP for SSL pinning. I followed the instructions on the the github but I get the error that the module isn't there.
My index.html
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="cordova.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/services.js"></script>
My app.js:
angular.module('starter', ['ionic', 'starter.controllers', 'starter.services', 'cordovaHTTP'])
In services.js:
angular.module('starter.services', [])
.service('MyService', function(cordovaHTTP) {
cordovaHTTP.enableSSLPinning(true, function() {
console.log('successful ssl pin');
cordovaHTTP.useBasicAuth("user", "pass", function() {
console.log('successful basic auth!');
cordovaHTTP.get(url, function(response) {
console.log(response.status);
}, function(response) {
console.error(response.error);
});
}, function() {
console.log('error basic auth');
});
}, function(){
console.log('error ssl pin');
});
});
This results in the error:
Uncaught Error: [$injector:modulerr] Failed to instantiate module starter due to:
Error: [$injector:modulerr] Failed to instantiate module cordovaHTTP due to:
Error: [$injector:nomod] Module 'cordovaHTTP' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
I have tried messing with this countless times but no dice. Any help is appreciated.
Actually I think you're initializing your module multiple times. In angular factories / services are singleton. Your code look like something this
angular.module('starter', ['ionic', 'MyService', 'cordovaHTTP']) //setters for a module
Please make sure you're injecting right service or factory name. You should change your service declaration way too, like below
angular.module('starter') //Don't use [] it is only getter of above initialized module
.service('MyService', function(cordovaHTTP){
//Code
});
Also please don't forget to load app.js at last. Hope it may help you.
I found the solution from github issues.
Make sure that you load the angular js files after cordova js files in index.html.
Here's my index.html:
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="lib/jquery/jquery-3.2.1.min.js"></script>
<script src="lib/ngCordova/dist/ng-cordova.min.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/routes.js"></script>
<script src="js/directives.js"></script>
<script src="js/services.js"></script>
Is angular defined?
cordova-HTTP will only instantiate the cordovaHTTP module if angular is defined otherwise it will fall back to window.cordovaHTTP.
You could use this this:
document.addEventListener("deviceready", function () {
console.log(window.cordovaHTTP);
console.log(window.CordovaHttpPlugin); // For some version it's instantiated in this name if angular is not defined.
}, false);
Manually bootstrap your AngularJS app instead of using the ng-app attribute.
Code:
<script>
angular.element(document).ready(function() {
document.addEventListener("deviceready", function () {
console.log(window.cordovaHTTP);
console.log(window.CordovaHttpPlugin); // For some version it's instantiated in this name if angular is not defined.
angular.bootstrap(document, ['MyAppName']);
}, false);
});
</script>
When using it in your controller or service, do not need to add the $.
Just use it like this:
angular.module('MyAppName.services', [])
.service('MyService', ['cordovaHTTP', function(cordovaHTTP){
// Your codes are here.
}]);
I did the following in the code:
angular-core.js:
var jdi = angular.module('jdi', ['ngStorage']);
login.html:
<!-- Angular -->
<script src="/assets/vendor/angular/angular.min.js"></script>
<script src="/assets/vendor/angular/angular-route.min.js"></script>
<script src="/assets/vendor/angular/angular-cookies.js"></script>
<script src="/assets/vendor/angular/angular-loader.js"></script>
it gives me the error:
Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.3.14/$injector/modulerr?p0=jdi&p1=Error%3A%20…2Flocalhost%3A3000%2Fassets%2Fvendor%2Fangular%2Fangular.min.js%3A17%3A381)
I'm new to angular, can anyone tell me what im doing wrong here?
Angular could not inject a module you required. Here, the only module from your code sample is ngStorage, and from login.html it seems that you did not load ngStorage javascript; if it is ngStorage from https://github.com/gsklee/ngStorage, you should have something like
<script src="/assets/vendor/ngstorage/ngStorage.min.js"/>