I try to make authorization in my app with angular.
I created app.service and injected "Restangular". And i have this error
Error: $injector:modulerr Module Error Failed to instantiate module cadastral due to:
Error: $injector:modulerr Module Error Failed to instantiate module Restangular due to:
Error: $injector:nomod Module Unavailable Module 'Restangular' 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 included all files in my html page
script src="/app/app/core/js/angular.js" type="text/javascript"
scrip src="/app/app/core/js/angular-resource.js" type="text/javascript"
script src="/app/app/core/js/angular-route.js" type="text/javascript"
script src="/app/app/core/js/restangular.js" type="text/javascript"
This is my app code
var app = angular.module('cadastral', ["ngRoute","ngResource",'ngCookies',"Restangular"]);
app.controller('authCtrl', function($scope,$http,$routeParams,AuthService,$cookies){
/**/
});
Ant this is AuthService:
app.service('AuthService', function($cookies, $http, Restangular) {
/**/
});
Can somebody help me?
what's problem?
when you inject a third party module into your project module you should send module name as parameter...
In your case you are injecting Restangular which is not the module name for restangular change it to restangular and you should be fine...
Restangular is the name of its service not module...
Related
I try to use angular-google-analytics for tracking traffic. I'm using angular 1.4.8.
Version of angular-google-analytics is 1.1.9. I included it in my bower.json file and linked script in my template.razr file as a showed below:
<script src='bower_components/angular-google-analytics/dist/angular-google-analytics.min.js'></script>
In main module of the app I did dependency injection as below in my .coffee file:
app = angular.module('speedUpApp', [
'angular-google-analytics',
'ngAnimate'
'ngCookies'
'ngSanitize'
'ngTouch'
'pascalprecht.translate'
'ui.router'
'ngMaterial'
'ngMap'
'slick'
'nl2br'
'lodash'
'angular-images-loaded'
'ui.select2'
'angular-iscroll'
'smoothScroll'
'angular-inview',
'dibari.angular-ellipsis'
'ngFileUpload'
])
First dependency is just angular-google-analytics. In spite of those steps after running my local server in my browser console I receive an error:
angular.js:68 Uncaught Error: [$injector:modulerr] Failed to instantiate module speedUpApp due to:
Error: [$injector:modulerr] Failed to instantiate module angular-google-analytics due to:
Error: [$injector:nomod] Module 'angular-google-analytics' 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.
Now I cannot recognize the problem, because I declared the angular-google-analytics module dependency and dependency injection too, despite of it, I still encounter this error. Any help?
I've been trying to understand how to set up Stripe for my app but am having problems with the implementation of the module. Normally when using a module i would require it in the top of the file to be able to use it but when i do it in the paymentCtrl file it doesn't work and i get the two errors below: where am i supposed to declare it for me to be able to use it? Well as you see i'm quite new to this and would like to understand how to structure this so that the payments work.
errors:
require is not defined
at paymentCtrl.js:1
and
Failed to instantiate module paymentController due to:
Error: [$injector:nomod] Module 'paymentController' 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.
paymentCtrl:
var stripe = require('stripe')('sk_test_....');
angular.module('paymentController', [])
.controller('paymentCtrl', function($scope) {
});
app.js:
angular.module('userApp', ['appRoutes', 'userControllers', 'userServices', 'ngAnimate', 'mainController', 'authServices', 'managementController', 'paymentController'])
.config(function($httpProvider) {
$httpProvider.interceptors.push('AuthInterceptors');
});
Stripe's Node.js library is meant to be used in server-side code. You should not embed it in client-side code, as doing so would reveal your secret API key.
In your client-side code, you can use Checkout or Elements to collect and tokenize payment information.
I am using ng-joyride for the first time.
I did bower install ng-joyride --save. And included it in my modules along with other modules like :
angular.module('some', [ 'ionic','ngJoyRide','ui.router',])
And now I am not able to see the view part of my app. And the console says
Uncaught ReferenceError: jQuery is not defined
and
Uncaught Error: [$injector:modulerr] Failed to instantiate module XYZ due to:
Error: [$injector:modulerr] Failed`enter code here` to instantiate module main due to:
Error: [$injector:modulerr] Failed to instantiate module ngJoyRide due to:
Error: [$injector:nomod] Module 'ngJoyRide' 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.
But before including ngJoyRide, I didn't get any issue with Jquery.
script tag with jquery in my index.html looks like :
<script src="bower_components/jquery/dist/jquery.js"></script>
I sense this might be a very silly mistake done by me. But not sure where I went wrong, help is much appreciated.
Thanks in advance.
I've installed angular-formly-templates-bootstrap via bower on a project that I've been working on. But when I try to inject it in angular, I receive the following error:
Uncaught Error: [$injector:modulerr] Failed to instantiate module bandar due to:
Error: [$injector:modulerr] Failed to instantiate module formlyBootstrap due to:
Error: [$injector:nomod] Module 'formlyBootstrap' 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.4.1/$injector/nomod?p0=formlyBootstrap
at http://localhost:3000/bower_components/angular/angular.js:68:12
at http://localhost:3000/bower_components/angular/angular.js:1949:17
at ensure (http://localhost:3000/bower_components/angular/angular.js:1873:38)
at module (http://localhost:3000/bower_components/angular/angular.js:1947:14)
at http://localhost:3000/bower_components/angular/angular.js:4355:22
at forEach (http://localhost:3000/bower_components/angular/angular.js:336:20)
at loadModules (http://localhost:3000/bower_components/angular/angular.js:4339:5)
at http://localhost:3000/bower_components/angular/angular.js:4356:40
at forEach (http://localhost:3000/bower_components/angular/angular.js:336:20)
at loadModules (http://localhost:3000/bower_components/angular/angular.js:4339:5)
The problem is, bower doesn't load angular-formly-templates-bootstrap in the browser. There are some other packages which are being loaded to the browser with bower. But I don't know what the problem is with formlyBootstrap.
Are you using gulp for inject bower dependencies? If so, find in gulp config something like that
exports.wiredep = {
exclude: [/bootstrap.js$/, /bootstrap-sass-official\/.*\.js/, /bootstrap\.css/],
directory: 'bower_components'
};
So all files ended with 'bootstrap.js' not injected. You can chage it with something like that
exports.wiredep = {
exclude: [/[^-]bootstrap.js$/, /bootstrap-sass-official\/.*\.js/, /bootstrap\.css/],
directory: 'bower_components'
};
Got the same error. I was working with gulp angular generator which seems to be ignoring formly bootstrap. I changed the main file in bower_components for angular-formly-bootstrap-template to dist/...bootstrap.min.js. Started working after that. Seems like the generator was ignoring files having bootstrap.js at the end
//index.html
<html ng-app="app">
//app.js
angular.module('app', 'test-module')
If I don't register the test-module in any of my scripts like below:
angular.module('test-module', [])
I will get errors below in brower and the whole website will not be loaded:
Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:
Error: [$injector:modulerr] Failed to instantiate module test-module due to:
Error: [$injector:nomod] Module 'test-module' 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.
Q: How to ensure the website page will be loaded even through there are any unknown modules loaded errors ?
I think you should look on this problem from other side.
If you use test-module (module for testing) you in development process. You could configure your backend for work in several environments. For example dev, test and prod. You can handle sub domain and decide on backend which modules need to be loaded. dev.yourdomain.com (for dev environment), yourdomain.com (for production environment) and test.yourdomain.com (for tasting).
You can generate such script:
<script type="text/javascript">
var MyModules = ['test-module'];
</script>
And handle it so:
angular.module.apply(angular, 'app', MyModules);
I found solution to you answer :)
Angular have array of requires for each module, so you can easily push some requires if you want to use this module.
In your case you can do this
//index.html
<html ng-app="app">
//app.js
angular.module('app', [])
//test-module.js
angular.module('test-module', [])
angular.module('app').requires.push('test-module');
So if you load test-module.js to your browser, you automatically inject dependency to your app.