Declared a Service
calculator_app.service('FullPath', function () {
this.full_path = function (pt, pg, prt, cd,scpe) {
-- some logic---
};});
Declared the Controller
calculator_app.controller("Opportunity_Controller", ['$scope', '$http', 'ngDialog', 'FullPath', 'FillOpportunity', function ($scope, FullPath, FillOpportunity, $http, ngDialog) {
$scope.find_path = function () {
$scope.result_path = FullPath.full_path($scope.res_pt, $scope.res_pg, $scope.res_prt, $scope.res_cd, $scope);
}]);
The line FullPath.full_path is throwing error as FullPath is undefined....
Dependencies order should be same, the way you have injected in DI array, basically you had mismatch in injection of dependency sequence.
calculator_app.controller("Opportunity_Controller", ['$scope', '$http', 'ngDialog', 'FullPath', 'FillOpportunity',
//corrected sequence of dependencies below
function ($scope, $http, ngDialog, FullPath, FillOpportunity) {
Related
I am new to Angular JS. I have created factory as follows.
angular.module('login',[])
.factory('authFactory',[function(){
// logic
}] );
and have injected into controller, but it gives me an error.
I also provided this factory file in index.html, but the error is the same.
[$injector:unpr] Unknown provider: authFactoryProvider <- authFactory
What should I do to avoid this?
Below is the code where I have injected it.
(function () {
'use strict';
angular.module('login', []).controller("LoginController", loginController)
loginController.$inject = ['$cookies', '$log', '$scope', '$rootScope', '$q', '$location', '$timeout', '$window',authFactory];
function loginController($cookies, $log, $scope, $rootScope, $q, $location, $timeout, $window,authFactory) {
Did you mean this? (you are missing '')
loginController.$inject = ['$cookies', '$log', '$scope',
'$rootScope', '$q', '$location', '$timeout', '$window', 'authFactory'];
Don't create module twice:
angular.module('login', [])
.factory('authFactory',[function(){
// logic
}] )
angular.module('login').controller("LoginController", loginController)
Don't use module twice make it as your practice to code like this
(function () {
'use strict';
var login = angular.module('login',[]);
login.factory('authFactory',[function(){
// logic
return {
}
}]);
login.controller("LoginController", loginController);
loginController.$inject = ['$log', '$scope', '$rootScope', '$q', '$location', '$timeout', '$window','authFactory'];
function loginController($log, $scope, $rootScope, $q, $location, $timeout, $window,authFactory) {
}
})();
As you are new to angular, i would recommend you to go through this youtube video which is very good
https://www.youtube.com/watch?v=FDhGmFul4YU&index=2&list=PLvZkOAgBYrsS_ugyamsNpCgLSmtIXZGiz
i want to test functions in angular js using jasmine. i have created one controller in which one scope function which is given below.
app.controller('NavigationCtrl', ['$scope', '$route', '$rootScope', function ($scope, $route, $rootScope) {
$scope.title="Hello World";
$scope.testMe = function () {
$scope.title = "Welcome";
}
}]);
Also, i want to call above controller function i.e $scope.testMe from another controller using jasmine test case. so, i create another controller and try to call functions from this controller.
app.controller('RunTestCaseCtrl', ['$scope', '$http', '$location', '$route', '$routeParams', '$rootScope', '$timeout', 'MDT_Constant', function ($scope, $http, $location, $route, $routeParams, $rootScope, $timeout, MDT_Constant) {
describe('mycontroller', function () {
beforeEach(module('app'));
it('scopeTestSpec',
inject(function ($controller, $rootScope) {
var $scope = $rootScope.$new();
$controller('NavigationCtrl', {
$scope: $scope
});
$controller.testMe();
expect($scope.title).toEqual('Welcome');
console.log('ok');
}));
});
}]);
this will give the error "module is not defined".
so, how can i call controller method from another controller using jasmine test
i'm a new in Angular. I try create factory but got an Error: AuthFactory.getUserInfo is not a function. Could somebody help me?
My Code:
auth.factory.js:
angular.module('tsg').factory('AuthFactory', function() {
return {
getUserInfo: function getUserInfo(){
console.log("AuthFactory.getUserInfo()");
return "userInfo";
}
};
});
header.js:
angular.module('tsg').controller('HeaderCtrl',HeaderCtrl);
HeaderCtrl.$inject = ['$scope', '$rootScope', '$location','$cookieStore','AuthFactory'];
function HeaderCtrl($scope, $cookieStore, AuthFactory)
{
AuthFactory.getUserInfo();
$scope.username = "UserName123";
$scope.date = new Date();
};
When you do a DI , their sequence really matters
HeaderCtrl.$inject = ['$scope', '$rootScope', '$location','$cookieStore','AuthFactory'];
function HeaderCtrl($scope, $cookieStore, AuthFactory)
the sequence of parameters is incorrect.
HeaderCtrl.$inject = ['$scope', '$rootScope', '$location','$cookieStore','AuthFactory'];
function HeaderCtrl($scope, $cookieStore, AuthFactory)
in your case AuthFactory instance inside your controller is not the factory you have written. It is the instance of $location service. You have misplaced it in the injection sequence.
When you do dependency injection follow the correct order of it as follows:
HeaderCtrl.$inject = ['$scope', '$rootScope', '$location','$cookieStore','AuthFactory'];
function HeaderCtrl($scope, $rootScope,$location,$cookieStore, AuthFactory)
now you factory will work as you expected.
Hi I have created two angulerjs files for same ng-app example.
admin.js
var app = angular.module('arcadminmodule', ['ngTable', 'ui-notification']);
app.controller('ArcAdminController', ['$http', '$scope', '$filter', '$interval', 'ngTableParams', 'Notification', function($http, $scope, $filter, $interval, ngTableParams, Notification) {});
admin1.js
var app = angular.module('arcadminmodule');
app.controller('ArcAdminController', ['$http', '$scope', '$filter', '$interval', 'ngTableParams', 'Notification', function($http, $scope, $filter, $interval, ngTableParams, Notification) {});
But its overriding admin.js from admin1.js
please help me out....
In admin1.js when you write:
var app = angular.module('arcadminmodule');
you are not creating a new module. You are trying to get an existing module named 'arcadminmodule'.. If you want to create a new module, you will have to write something like this:
var app = angular.module('arcadminmodule',[]); // add your depencencies...
Now, In your case, in admin.js you are creating your module and admin1,js you are making use of the same module. In angular you cannot have two controllers with the same name. Controllers are for (from the docs):
Set up the initial state of the $scope object.
Add behavior to the $scope object.
So If you need are trying to apply some roles or some business logic, It need to go into one controller. Make sure your controller contain only the business logic needed for a single view.
I think its no need for use the same controller in two places.But you can use services in places.If you need to do some think different from the ArcAdminController,use this structure.
Services
-service1.js
(function (angular) {
angular.module('marineControllers').service('boatService', function (ajaxService) {
}
)
-service2.js
-module..js
var artistControllers = angular.module('marineControllers',['ngAnimate']);
Controllers
-controller1
(function (angular) {
angular.module('marineControllers').controller("BoatController", ['$scope', '$http', '$routeParams',
'dashboardService', '$filter', 'loginService', '$location', 'boatService', 'autocompleteFactory', 'utilityFactory',
function ($scope, $http, $routeParams, dashboardService, $filter, loginService, $location, boatService, autocompleteFactory, utilityFactory) {
function loadAllFishingBoat() {
$scope.boatsTable.length = 0;
if (!$scope.$$phase)
$scope.$apply();
boatService.getAllBoatAndDevice().then(function (data) {
$scope.boatsTable = data;
if (!$scope.$$phase)
$scope.$apply();
});
};
}]);
})(angular);
-controller2
(function (angular) {
angular.module('marineControllers').controller("DeviceController", ['$scope', '$http', '$routeParams',
'dashboardService', '$filter', 'loginService', '$location', 'deviceService', 'autocompleteFactory', 'utilityFactory','commonDataService',
function ($scope, $http, $routeParams, dashboardService, $filter, loginService, $location, deviceService, autocompleteFactory, utilityFactory,commonDataService) {
function loadAllFishingBoat() {
$scope.boatsTable.length = 0;
if (!$scope.$$phase)
$scope.$apply();
boatService.getAllBoatAndDevice().then(function (data) {
$scope.boatsTable = data;
if (!$scope.$$phase)
$scope.$apply();
});
};
}]);
})(angular);
I have been use many services in both controllers,still they are different logics.
I have the following in a controller.
$rootScope.$on('progressbarEvent', function (event, data) {
$rootScope.progresscurrent = data.currentprogress;
console.log('Event listening: ' + $rootScope.progresscurrent);
});
I have this in a factory service.
$rootScope.$emit('progressbarEvent', dataFactory.currentprogress);
$on is returned undefined. Anyone knows the cause of this?
My controller is:
app.controller('indexcontroller', ['$rootScope','$scope', '$http', 'dataFactory',
function ($scope,$http,$rootScope, dataFactory) {
The order of dependencies has to be consistent with the array it was declared in:
app.controller('indexcontroller', ['$rootScope','$scope', '$http', 'dataFactory',
function ($rootScope, $scope, $http, dataFactory) {