AngularJS: Inject controller inside another controller from the same module

Question

Is possible to inject a controller into another controller that is part of the same module?

example:

var app = angular.module('myAppModule', [])
.controller('controllerOne', ['$scope', function($scope){
  $scope.helloWorld = function(){
    return 'Hello World';
  }
}])
.controller('controllerTwo', ['$scope', 'controllerOne', function($scope, controllerOne){
  console.log(controllerOne.helloWorld());
}])

I keep getting unknown provider on controllerOne. I don't see how that's possible since they coexist in the same module. Any help would be much appreciated.

possible duplicate of [Can one controller call another?](http://stackoverflow.com/questions/9293423/can-one-controller-call-another) — Artem Petrosian, Apr 28 '15 at 18:09
Thanks for all suggestions!!! You all are right, i'll be moving the shared logic into a factory, it's just easier and less of a headache lol. — Joseph Freeman, Apr 28 '15 at 18:58

score 29 · Accepted Answer · answered Apr 28 '15 at 18:26

29

You need to use $controller dependency by using that you can inject one controller to another

.controller('controllerTwo', ['$scope', '$controller', function($scope, $controller){
  $controller('controllerOne', {$scope: $scope})
  //inside scope you the controllerOne scope will available
}]);

But do prefer service/factory to share data

answered Apr 28 '15 at 18:26

Pankaj Parkar

134,766
23
234
299

This is a great solution but how is this not as good as using a service/factory to share data? What if I just want to use a function in controllerOne ? Can't I use $controller for that? – gerl Apr 28 '15 at 20:52
8

"But do prefer service/factory to share data". Yes! Yes! Yes! – Rap May 12 '16 at 13:27
Can you give an example that how to call a function in another controller after injecting – Rigin Oommen Jul 20 '17 at 05:43
@RiginOommen what do you mean by another controller?? – Pankaj Parkar Jul 20 '17 at 05:47
consider that if a function is defined in a controllerA and i need to access the specific function from controllerB. then how can we make it by using the $controller can you give an example please – Rigin Oommen Jul 20 '17 at 06:02
@RiginOommen then first you need to import other controller in your desired controller by above code. Afterwards all `import`ed controller method available inside `$scope`. so you could call them directly like `$scope.myOtherControllerMethod()` – Pankaj Parkar Jul 20 '17 at 06:06
$controller('GenericController', {$scope: $scope}); $scope.testing(); – Rigin Oommen Jul 20 '17 at 06:23
@RiginOommen that should work.. could you open a question on stackoverflow explaining problem statement.. I'll love to look into that.. – Pankaj Parkar Jul 20 '17 at 06:25
https://stackoverflow.com/questions/45206840/how-to-use-a-code-defined-in-controllera-in-controller-b – Rigin Oommen Jul 20 '17 at 06:30
Works perfect! Thanks a lot – Kishan Apr 20 '18 at 11:28

score 3 · Answer 2 · answered Apr 28 '15 at 18:23

Move your logic into a "service" (either a factory/service/provider). I personally prefer factories, I just like controlling my own object instead of using this or anything like that with the other options.

Using a service, you give yourself the ability to abstract business logic from your controllers, and make that logic -- reusable -- !

var app = angular.module('myAppModule', [])

// typically people use the word Service at the end of the name 
// even if it's a factory (it's all the same thing really...

.factory('sharedService', function () {

    var methods = {};

    methods.helloWorld = function () {
        return 'Hello World!';
    };

    // whatever methods/properties you have within this methods object
    // will be available to be called anywhere sharedService is injected.

    return methods;
})

Notice sharedService is injected

.controller('ControllerOne', ['$scope', 'sharedService', function($scope, sharedService) {
    $scope.helloWorld = sharedService.helloWorld();
}])

// Notice sharedService is injected here as well
.controller('ControllerTwo', ['$scope', 'sharedService', function($scope, sharedService){

    // Now we can access it here too!
    console.log( sharedService.helloWorld() );
}]);

Side note : Controllers should be capitalized to show their significance!

The power of services :)

score 1 · Answer 3 · answered Apr 28 '15 at 18:25

If the a controllerTwo needs to call the same function as controllerOne, you may want to create a service to handle it. Angular Services - they are accessible throughout your program through dependency injection.

var app = angular.module('myAppModule', [])
.controller('controllerOne', ['$scope', 'Hello', function($scope, Hello){
   console.log(Hello.helloWorld() + ' controller one');
}])
.controller('controllerTwo', ['$scope', 'Hello', function($scope, Hello){
   console.log(Hello.helloWorld() + ' controller two');
}])
.factory('Hello', [function() {
   var data = {
      'helloWorld': function() {
          return 'Hello World';
       }
   }

   return data;
}]);

Hope this helps!

score 0 · Answer 4 · edited May 23 '17 at 11:54

0

You cannot inject controllers in another controllers,only serviceProviers are injectable.That's the reason you are getting error as unkown provider in controller one.

Use Services instead and inject them in controllers,if there is some come functionality to be shared among controllers.Services are the best way to share data in between controllers.

You can declare a variable or function or say object on $rootScope, it's exists in your whole application.

Share data between AngularJS controllers

edited May 23 '17 at 11:54

Community

1
1

answered Apr 28 '15 at 18:32

Ritt

3,181
3
22
51

using $rootScope is considered as bad pattern in angularjs – Pankaj Parkar Apr 28 '15 at 19:43
Yes, it is a bad practice to use $rootScope,i mentioned it as it is the one of the options to be used. – Ritt Apr 28 '15 at 19:47
You should never use `$rootScope` , that is why I'm saying that you $rootScope suggestion not appropriate – Pankaj Parkar Apr 28 '15 at 19:49

AngularJS: Inject controller inside another controller from the same module

4 Answers4

Linked