Call a global function - angularjs

Question

I come to you because I do not know how to access two different controllers to a global function.
I try to access a generic function that should be called two different controllers. The disconnect feature allows you to disconnect from the application, but also reset the global variables.
controller_1 and controller_2:
function CONTROLLER_1 ($scope, $rootScope) {
$scope.disconnect = function() {
// RESET $rootScope variable
$rootScope.var1 = 0;
$rootScope.var2 = 0;
etc...
};
}
function CONTROLLER_2 ($scope, $rootScope) {
$scope.disconnect = function() {
// RESET $rootScope variable
$rootScope.var1 = 0;
$rootScope.var2 = 0;
etc...
};
}
I would like something like this:
function CONTROLLER_1 ($scope, $rootScope) {
$scope.disconnect = function() {
//CALL GLOBAL_METHOD
}
}
function CONTROLLER_2 ($scope, $rootScope) {
$scope.disconnect = function() {
//CALL GLOBAL_METHOD
}
}
My GLOBAL_METHOD {
// RESET $rootScope variable
$rootScope.var1 = 0;
$rootScope.var2 = 0;
etc...
}
Is it possible to have a similar solution in this case?
If I'm not precise enough, do not hesitate to ask me for more information
Thank you for your help.

Answer 1

It seems that you should use a service for that:
I can see two solutions:
1°) Since each controllers inherit from rootScope, you can define disconnect function on rootScope you will be able to call disconnect automatically:
angular.module('app').run(['$rootScope', function($rootScope) {
$rootScope.disconnect = function() {
$rootScope.var1 = 0;
$rootScope.var2 = 0;
};
}]);
angular.controller('Ctrl1', ['$scope', '$rootScope', function($scope, $rootScope) {
// Disconnect function is already define
$scope.applyDisconnect = function() {
$scope.disconnect(); // Or $rootScope.disconnect();
};
}]);
angular.controller('Ctrl2', ['$scope', '$rootScope', function($scope, $rootScope) {
// Disconnect function is already define
}]);
Be careful, you should not redefine disconnect function.
See this fiddle: http://jsfiddle.net/37cMw/2
2°) Use a dedicated service and inject it in your controllers:
angular.module('myApp').service('DisconnectService', ['$rootScope' function($scope) {
this.disconnect = function() {
$rootScope.var1 = 0;
$rootScope.var2 = 0;
};
}]);
angular.module('myApp').controller('Ctrl1', ['$scope', 'DisconnectService', function($scope, service) {
$scope.disconnect = function() {
service.disconnect();
};
}]);
angular.module('myApp').controller('Ctrl2', ['$scope', 'DisconnectService', function($scope, service) {
$scope.disconnect = function() {
service.disconnect();
};
}]);
See this fiddle: http://jsfiddle.net/QFvyj/
Second solution is my favourite since you don't pollute rootScope namespace.

Answer 2

Yes you can! Add the method to the .run of your module
angular.module('app').run(function($rootScope) {
$rootScope.GLOBAL_METHOD = function() {
//YOUR STUFF
})
})
And you can call this method from every controller like this:
$rootScope.GLOBAL_METHOD();
So in your case:
function CONTROLLER_1 ($scope, $rootScope) {
$scope.disconnect = function() {
$rootScope.GLOBAL_METHOD();
}
}
function CONTROLLER_2 ($scope, $rootScope) {
$scope.disconnect = function() {
$rootScope.GLOBAL_METHOD();
}
}

Answer 3

While the provided solution by user2874153 would probably work, it's best to avoid polluting the $rootScope. To share functions between controllers you should create a service.
You should also avoid declaring controllers in the global namespace, and should use the angular.module syntax instead (see http://docs.angularjs.org/guide/controller#setting-up-the-initial-state-of-a-object, the part where it says 'NOTE: ').
angular.module('myApp', []);
angular.module('myApp')
.controller('OneCtrl', function ($scope, SharedService) {
SharedService.doSomething();
});
angular.module('myApp')
.controller('TwoCtrl', function ($scope, SharedService) {
SharedService.doSomething();
});
angular.module('myApp')
.service('SharedService', function () {
return {
doSomething: function () {
// do something here.
}
};
});