i am using ngRoute module but its showing me error so is there extra file need to add for using this module i search but i did'nt found like other modules resourse,cookies we need seperate files for is it for ngroute also if yes so where can i found this
Error:-
Uncaught Error: No module: ngRoute
var app = angular.module('inventoryApp', ['ngCookies','ngResource', 'ngRoute']);
controller.js
app.controller('storesController', function ($rootScope, $scope, $location, $cookies, $routeParams) {
});
You do need a separate file. Please see:
http://docs.angularjs.org/api/ngRoute
First include angular-route.js in your HTML:
<script src='angular.js'>
<script src='angular-route.js'>
As of AngularJS 1.2.0, ngRoute is separated in its own module.
Download: http://code.angularjs.org/1.2.1/
Changelog: https://github.com/angular/angular.js/blob/master/CHANGELOG.md
Related
I like to use Popover in my AngularJS application and have included ui-bootstrap for this, but I get an injection error:
Error: [$injector:unpr] Unknown provider: ui.bootstrapProvider <- ui.bootstrap
In my index.html
<script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.13.4.js"></script>
In my controller class:
angular
.module('app')
.controller('TeamsController', TeamsController);
TeamsController.$inject = ['Flash', '$scope', 'ui.bootstrap'];
function TeamsController(Flash, $scope, $modal)
{
//Code here
}
I cant really figure out how to do this correctly.
You have to include it as a dependency to your app:
angular.module('myModule', ['ui.bootstrap']);
More info on the Angular UI page.
Update
Working plunker. Note that I have removed the Flash dependency because I don't know what it is, you must add it yourself back in the script.
how can I start to use this module: http://gregpike.net/demos/angular-local-storage/demo/demo.html
I have a controller:
app.controller('FormController', function ($scope, localStorageService) {
});
And I injected
localStorageService
as shown in example, but naturally nothing work. How can I fix it? Thanks.
First, you link the script from your page:
<script src=".../angular-local-storage.min.js"></script>
Second, you add the module to the module dependencies array (I guess that's what you missed):
angular.module('myApp', [..., 'LocalStorageModule', ...])
Then you can inject and use localStorageService in your components, as you did.
That said, I would add a step 0 : Read this Readme :)
i recommend you this one https://github.com/gsklee/ngStorage also use this syntax for not breaking whe you minify
app.controller('FormController', ["$scope", "otherProvider",function ($scope, otherProvider) {
//in this way angular know what to inject
}]);
I'm attempting to use the ng-file-upload directive (https://github.com/danialfarid/ng-file-upload) to add file-uploading functionality to my project, but keep getting this error:
Error: [$injector:unpr] http://errors.angularjs.org/1.4.6/$injector/unpr?p0=UploadProvider%20%3C-%20Upload%20%3C-%20ExperimentController
at Error (native)
at http://localhost:8000/static/editor/js/angular.min.js:6:416
at http://localhost:8000/static/editor/js/angular.min.js:40:409
at Object.d [as get] (http://localhost:8000/static/editor/js/angular.min.js:38:394)
at http://localhost:8000/static/editor/js/angular.min.js:40:483
at d (http://localhost:8000/static/editor/js/angular.min.js:38:394)
at e (http://localhost:8000/static/editor/js/angular.min.js:39:161)
at Object.instantiate (http://localhost:8000/static/editor/js/angular.min.js:39:310)
at http://localhost:8000/static/editor/js/angular.min.js:80:313
at A.link (http://localhost:8000/static/editor/js/angular-route.min.js:7:268) <div ng-view="" ng-show="main.results==null" class="ng-scope">
I'm including the correct files in my index.html:
<script src="/static/editor/js/angular.min.js"></script>
<script src="/static/editor/js/ng-file-upload-shim.js"></script>
<script src="/static/editor/js/ng-file-upload.js"></script>
I'm declaring it my module:
(function() {
angular
.module('myApp', [
'ngRoute',
'ngAnimate',
'ngCookies',
'ngFileUpload'
]);
})();
But when I attempt to inject it into my controller, it throws the above error:
(function() {
angular
.module('myApp')
.controller('myController', myController);
myController.$inject = ['$routeParams',
'$compile',
'$scope',
'$interval',
'Upload'];
function myController($routeParams,
$compile,
$scope,
$interval,
Upload) {
....
I'm using Angular 1.4.6, and ng-file-upload 9.0.14. I downloaded the files manually, and included the indicated .js files in my project directory. Are there maybe some extra dependencies that are included via bower or npm that I'm missing?
Any help would be greatly appreciated!
UPDATE: Viewing the ng-file-upload directive's live demo page with AngularJS 1.4.6 (https://angular-file-upload.appspot.com/#/1.4.6) also causes numerous errors, so this might just be an incompatibility with 1.4.6 and the lastest version of ng-file-upload.
You are trying to inject unknown service called "Upload", if you mean the upload service of ng-file-upload you need to inject "ngFileUpload" instead of "Upload".
myController.$inject = ['$routeParams',
'$compile',
'$scope',
'$interval',
'ngFileUpload'];
function myController($routeParams,
$compile,
$scope,
$interval,
ngFileUpload) {
....
in my ionic app I want to use cordova-plugin-video-editor plugin but I don't know how to inject it on my controller.
I added the plugin on the terminal like this:
ionic plugin add https://github.com/jbavari/cordova-plugin-video-editor.git
And it is injected with the controller like this (last one):
.controller('VideoCtrl', ['$scope', '$ionicPlatform', '$ionicModal', '$cordovaDialogs', '$cordovaCapture', '$cordovaFileTransfer', '$sce', 'VideoService', '$q', '$http', '$ionicScrollDelegate', '$timeout', '$location', 'VideoEditor', function ($scope, $ionicPlatform, $ionicModal, $cordovaDialogs, $cordovaCapture, $cordovaFileTransfer, $sce, VideoService, $q, $http, $ionicScrollDelegate, $timeout, $location, VideoEditor) {
I get this error:
Uncaught Error: [$injector:modulerr] Failed to instantiate module starter due to:
Error: [$injector:modulerr] Failed to instantiate module starter.controllers due to:
Error: [$injector:modulerr] Failed to instantiate module VideoEditor due to:
Error: [$injector:nomod] Module 'VideoEditor' 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 am confused, I am using more plugins but all are official and I didn't have problems as I only had to do:
angular.module('starter.controllers', ['ngCordova'])
And in the html
<script src="lib/ngCordova/dist/ng-cordova.js"></script>
Inside plugin folder there is a js file that has:
var exec = require('cordova/exec'),
pluginName = 'VideoEditor';
function VideoEditor() {
}
VideoEditor.prototype.transcodeVideo = function(success, error, options) {
exec(success, error, pluginName, 'transcodeVideo', [options]);
};
VideoEditor.prototype.createThumbnail = function(success, error, options) {
exec(success, error, pluginName, 'createThumbnail', [options]);
};
module.exports = new VideoEditor();
When I install the plugin should not this js content had gone somewhere in my www folder so then I can imported from html?
Remove the VideoEditor module in your controller configuration. because this VideoEditor have not any relation with angular.
Also you need refer the github document. They use it just like a jquery plugins. not a angular plugins. Does make sense? let me know, if not.
How do I implement it in Angular controller?
You can use it just like a javascript library.
I am trying to get access to the current route since I added a title on it.
So the route looks something like
state('reports', {
title: 'Reports',
url: '/reports',
templateUrl: 'modules/feeditems/views/reports.client.view.html'
}).
I want to get access to the title. so I can put it on my page Header. So in the Header controller I thought I could just get it off my
angular.module('core').controller('HeaderController', ['$rootScope', '$route', '$scope', 'Authentication', 'Menus',
function($rootScope, $route, $scope, Authentication, Menus) {
$scope.authentication = Authentication;
$scope.isCollapsed = false;
$scope.menu = Menus.getMenu('topbar');
$scope.$route = $route;
console.log ('typeof($route) = ' + typeof($route));
console.log ('typeof($route.current) = ' + typeof($route.current));
and I get the following error
Error: [$injector:unpr] Unknown provider: $routeProvider <- $route
so I add ngRoute
ApplicationConfiguration.registerModule('core', ['ngRoute']);
then I get the following error
Uncaught Error: [$injector:modulerr] Failed to instantiate module r2h
due to: Error: [$injector:modulerr] Failed to instantiate module core
due to: Error: [$injector:modulerr] Failed to instantiate module
ngRoute due to: Error: [$injector:nomod] Module 'ngRoute' 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.
How am I supposed to include this properly? the meanjs way?
I think you are confused, MeanJS standard configuration uses Angular UI Router
For Angular UI Router
You need to angular-ui-router.js then include ui.router inside your app dependency
After that in configuration do register your state using $stateProvider
Syntax
app.config(function($stateProvider){
$stateProvider.state('reports', {
url: '/reports',
templateUrl: 'modules/feeditems/views/reports.client.view.html'
})
})
For adding title dynamically you could refer this SO Answer
Kindly refer to https://stackoverflow.com/a/28252931/4380266
. This has the solution to your problem.
Check the sequence you loaded your angular files.
The sequence must be :
angular.js
angular-route.js
finally your angular scripts