Javascript AngularJS：将控制器注入来自同一模块的另一个控制器内

AngularJS: Inject controller inside another controller from the same module

提问by Joseph Freeman

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.

我不断在 controllerOne 上获取未知的提供者。我不明白这是怎么可能的，因为它们共存于同一个模块中。任何帮助将非常感激。

回答by Pankaj Parkar

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

您需要使用$controller依赖项，您可以将一个控制器注入另一个控制器

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

But do prefer service/factoryto share data

但确实更喜欢service/factory共享数据

回答by Mark Pieszak - Trilon.io

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 thisor anything like that with the other options.

将您的逻辑移至“服务”（工厂/服务/提供商）。我个人更喜欢工厂，我只是喜欢控制我自己的对象，而不是使用this其他选项或类似的东西。

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 sharedServiceis injected

注意sharedService被注入

.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 :)

服务的力量:)

回答by Matt Lemieux

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.

如果 controllerTwo 需要调用与 controllerOne 相同的函数，您可能需要创建一个服务来处理它。Angular 服务- 通过依赖注入可以在整个程序中访问它们。

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!

希望这可以帮助！

回答by Ritesh

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

你不能在另一个控制器中注入控制器，只有serviceProviers是可注入的。这就是你在控制器一中作为未知提供者收到错误的原因。

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.

您可以在$rootScope上声明变量或函数或说对象，它存在于您的整个应用程序中。

Share data between AngularJS controllers

在 AngularJS 控制器之间共享数据