Call a Controller angularjs in another Controller angularjs

Question

Well my problem is I have 2 controllers... and I wanna know whether is possible call any function from them in order to do work them together... For instance:

firstController.js

angular.module('myApp').controller('FirstController', ['$scope', 'FirstService', function($scope, FirstService) {
    function verify(){
        //Some operations
    }
}]);

secondController.js

angular.module('myApp').controller('SecondController', ['$scope', 'SecondService', function($scope, SecondService) {
    function edit(iditem){
        //Some operations
        //I wanna call here verify() function
    }
}]);

Is this possible?

Thanks in advance!

No, it's not. Especially since those functions are completely private to the controller. Use a service, or events, to make your controllers collaborate. Hard to say more without a concrete use-case. — JB Nizet
– JB Nizet, Commented Oct 30, 2016 at 23:18
Did you try this solution ? stackoverflow.com/questions/9293423/… — mylonos
– mylonos, Commented Oct 30, 2016 at 23:33
Ok.. and How could get call 2 services in a controller by this way? — Roldan
– Roldan, Commented Oct 30, 2016 at 23:41

Lucas · Accepted Answer · 2016-10-31 00:08:31Z

2

You could do it with only one service and call service from both controllers. This is a basic example, you could add a constructor and pass it $scope for example it depends on what you want to accomplish.

'use strict';

/**
 * Service
 */

angular.module('myApp.someService', [])
        .factory("someService", function () {

           return {   
               verify: function() {},
               edit: function(iditem){
                   self.verify();
               }
});

Then your controllers would look like this:

angular.module('myApp').controller('FirstController', ['$scope', 'someService', function($scope, someService) {

   service.verify($scope);

}]);

angular.module('myApp').controller('SecondController', ['$scope', 'someService', function($scope, someService) {

    service.edit(iditem);

}]);

answered Oct 31, 2016 at 0:08

Lucas

10.4k6 gold badges45 silver badges55 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

georgeawg · Accepted Answer · 2016-10-31 13:57:01Z

Using Prototypical Inheritance

If the controllers are nested:

<div ng-controller="FirstController">

    <div ng-controller="SecondController">

    </div>

</div>

If the FirstController publishes its functions on $scope, the nested controllers can invoke the functions by prototypical inheritance.

Publish function on $scope:

app.controller('FirstController', function($scope) {

    $scope.firstVerify = verify;

    function verify(){
        //Some operations
    }
});

Invoke by $scope inheritance:

app.controller('SecondController', function($scope) {
    function edit(iditem){
        //Some operations
        //I wanna call here verify() function
        $scope.firstVerify();
    }
});

This will only work if the second controller's scope is a child scope of the first controller's scope.

As you can see, there are many answers to the question. Which answer to use depends on the specific use case.

Lucas · Accepted Answer · 2016-10-31 01:14:17Z

0

You can do that through $rootScope controller

include $rootScope in FirstContoller, assign a function:

$rootScope.myFirstController_verify = verify;

And call it from second controller with $rootScope included:

$rootScope.myFirstController_verify();

edited Oct 31, 2016 at 1:14

Lucas

10.4k6 gold badges45 silver badges55 bronze badges

answered Oct 31, 2016 at 0:48

Ulterior

2,9224 gold badges34 silver badges58 bronze badges

Collectives™ on Stack Overflow

Call a Controller angularjs in another Controller angularjs

3 Answers 3

Comments

Using Prototypical Inheritance

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Using Prototypical Inheritance

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related