I want to use the code form this Plunk.
It has a directive:
myApp.directive('fileModel', ['$parse', function ($parse) {
and a service
myApp.service('fileUpload', ['$http', function ($http) {
and the example injects into the controller thusly:
myApp.controller('myCtrl', ['$scope', 'fileUpload', function($scope, fileUpload){
I have this:
angular
.module('Dashboard')
.controller('DashboardController', DashboardController);
and
function DashboardController($rootScope, $scope, $http,
$interval, $state, $location)
{
But I can't figure out how to inject the file upload into my controller :-(
Try like this. i think your problem is for module name.i define fileUpload service in same module for DashboardController
var myApp = angular.module("yourAppName",[]);
myApp.directive('fileModel', ['$parse', function ($parse) {
...
myApp.service('fileUpload', ['$http', function ($http) {
...
myApp.controller('DashboardController', DashboardController);
function DashboardController($rootScope, $scope, $http,
$interval, $state, $location,fileUpload)
{
Related
I have easy service in my app.
var app = angular.module("appTest", []);
app.service('AuthService', function ($scope) {
$scope.write = function(){
console.log("service")
};
});
And I want to use it in my controller
var app = angular.module('appTest');
app.controller("LoginController", ['$scope', '$http', '$cookies',
'$cookieStore', '$rootScope', '$location',
function ($scope, $http, $cookies, $cookieStore, $rootScope, $location,
AuthService) {
AuthService.write();
}]);
But I have mistake http://prntscr.com/mckff7
I did my service by any case. Result the same.
I add my service by this way http://prntscr.com/mckgrt
You're not 'injecting' the AuthService into your controller. You're receiving it as an object, but you need to declare it in the array of strings too for it to actually be injected.
Your controller code should look like this:
var app = angular.module('appTest', []);
app.service('AuthService', function ($scope) {
$scope.write = function(){
console.log('hello world');
};
});
app.controller("LoginController", ['$scope', '$http', '$cookies',
'$cookieStore', '$rootScope', '$location', 'AuthService',
function ($scope, $http, $cookies, $cookieStore, $rootScope, $location,
AuthService) {
AuthService.write();
}]);
My service:
angular.module('app').factory('keretHttpSrv', function ($http, $state, $scope, $rootScope, $q, $localStorage) {
/*some code*/
return keretHttpService;
})
My controller,
angular.module('app.dashboard')
.controller('DashboardCtrl',
['$scope', 'keretHttpSrv', function ($scope, keretHttpSrv)
{
/*some code*/
}])
I have this error:
Error: $injector:unknown provider
How can I solve this problem?
there is no $scope for a factory
FIX
angular.module('app').factory('keretHttpSrv', function ($http, $state, $rootScope, $q, $localStorage) {
/*some code*/
return keretHttpService;
})
You are adding the 'keretHttpSrv' factory to the 'app' module and adding the 'DashboardCtrl' controller to the 'app.dashboard' module. To access the factory you will have to either inject the 'app' module into 'app.dashboard' when you define it
angular.module('app.dashboard', ['app']);
or put both the factory and the controller in the same module
//first define the module
angular.module('app', []);
angular.module('app').factory('keretHttpSrv', function ($http, $state, $scope, $rootScope, $q, $localStorage) {
/*some code*/
return keretHttpService;
})
angular.module('app')
.controller('DashboardCtrl',
['$scope', 'keretHttpSrv', function ($scope, keretHttpSrv)
{
/*some code*/
}])
do you need to use routing here
you have two option :
angular.module("app",['ngRoute']);
it is lib in angular but the second option is better
2.angular.module("app",['ui.router']);
after you need to config the provider of $state in
angular.module("app",['ui.router']).config(function($stateProvider,...){};
all about ui router u can read here UI ROUTER
and see example here Examples
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
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.
app.controller('LoginController', ['$http','$scope', function ($http, $scope, $location) {
$location.path("Home/Index");
}]);
browser give error that $location in undefined, how I troubleshoot it
You did not add $location to dependency notation:
app.controller('LoginController', ['$http','$scope', '$location', function ($http, $scope, $location) {
$location.path("Home/Index");
}]);