Angularjs：別のコントローラに1つのコントローラを注入できません

Question

私は他のすべてのコントローラに注入しようとしているこのコントローラAを持っています。 コントローラAは、工場との通信を行います（認証サービスを実行し、データベースと通信します）

私の工場はこのように見え、私はmyFactoryServices.jsという名前を付けてインデックスページにリンクを入れました。

(function() { 

angular 
.module('myApp.myFactoryServices', []) 

.factory('FactoryService', ["$http", "$location", function($http, $location){ 
    var my = this; 
    my.someFunction = function() 
    { 
     //communiate with backend and return data 
    } 
    return my; 
}]); 

})(); 

と私のコントローラーAは次のようになります。

(function() { 

    angular 
     .module('myApp.ControlA', []) 

     .controller('ControllerA', function($scope,$routeParams, FactoryService) { 
      var my = this;  
      FactoryService.someFunction(); 

     }); 
})(); 

そして、私は他のすべてのコントローラでこのコントローラを注入しようとしていますが、それは動作しません。私はプログラミングのこの種のかなり新しいです、誰かが私が間違ってどこに教えてくれますか？

これは私が別のコントローラーにコントローラーを注入しようとした方法です。

私はこれらの工場サービスを使用することができないため、エラーは発生せず、コントローラは注入されません。これは正しい方法ですか？

Answer 1

まず、コントローラーを別のコントローラーに挿入することはできません。単純な解決策の1つは、各コンポーネントの各角度モジュールを使用せずに、モジュールを宣言して、

コード：

var app = angular.module('myApp', []); 
app.factory('FactoryService', ["$http", "$location", function($http, $location){ 
    var my = this; 
    my.someFunction = function() 
    { 
     //communiate with backend and return data 
    } 
    return my; 
}]); 

app.controller('ControllerA', function($scope,$routeParams, FactoryService) 
{ 
    var my = this;  
    FactoryService.someFunction(); 

}); 

app.controller('ControllerB', function($scope,$routeParams, FactoryService) 
{ 
    var my = this;  
    FactoryService.someFunction(); 
}); 

Answer 2

コントローラコントローラはシングルトンではないので、注射はありません。コントローラは、コントローラのインスタンスを作成するために使用されるコンストラクタ関数です。あなたがあなたの代わりに工場を使用する必要があり、コントローラの間にいくつかの行動を共有したいのであれば

angular.module('app', []); 
 

 
angular 
 
    .module('app') 
 
    .controller('Example', function() { 
 
    this.x = Math.random(); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.js"></script> 
 
<div ng-app="app"> 
 
    First instance: <br> 
 
    <div ng-controller="Example as Ex1"> 
 
    {{Ex1.x}} 
 
    </div> 
 
    Second instance: <br> 
 
    <div ng-controller="Example as Ex2"> 
 
    {{Ex2.x}} 
 
    </div> 
 
</div>

：たとえば、あなたのアプリ内の1つのコントローラの複数のインスタンスを持つことができます。

Answer 3

コントローラを別のコントローラに挿入するには、$controllerサービスを使用します。

app.controller('ControllerB', function($scope,$routeParams, $controller) { 
     var my = this; 
     $scope.ctrlA = $controller("ControllerA", {$scope: $scope});  

}); 

上記の例では、親コントローラの範囲を注入し、その$scopeとControllerA as ctrlAのインスタンスを作成します。

詳細については、AngularJS $controller Service API Referenceを参照してください。