Angular 1：$ injectorがプロバイダー内にプロバイダーをインジェクトするときにプロバイダーの依存関係を見つけることができません

Question

私は、いくつかのヘルパークラスAとBがサービスであり、AがBに依存しています。それらのプロバイダは.configフェーズで使用できるようにします。

私はプロバイダ内でプロバイダを読み込むためにthis SO answerを続けました。

あなたはここで見ることができるように、それが動作します：

http://plnkr.co/edit/SIvujHt7bprFumhxwJqD?p=preview

var coreModule = angular.module('CoreModule', []); 
coreModule.provider('Car', function() { 
    //CarProvider.engine 
    this.engine = 'big engine'; 

    //Car 
    this.$get = function() { 
    return { 
     color: 'red' 
    }; 
    }; 
}); 
coreModule.provider('ParameterService', ['$injector', function($injector) { 
    try { 
    var CarProvider = $injector.get('CarProvider'); 
    this.deepEngine = CarProvider.engine; 
    console.log('deepEngine = ' + this.deepEngine); 
    } catch (e) { 
    console.log("nope!") 
    } 

    // ParameterService 
    this.$get = function() { 
    return {}; 
    }; 
}]); 
coreModule.config(function(CarProvider) { 
    console.log('configEngine = ' + CarProvider.engine); // big engine 
}); 

私はこのために、1つのファイルにCarとParameterServiceを持っている場合、これは動作します。しかし

私は、ディスク上の複数のファイルにCarとParameterServiceを分割、または私はParameterService内部$injector.get('CarProvider')に障害が発生すると、同じファイルにCar前ParameterServiceを定義します。

問題を解決するにはどうすればよいですか？

ファイルごとに1つのプロバイダ/サービスを持ちたいと思いますが、何が不足しているのか分かりません。

Answer 1

サービスはサービスインスタンスが注入され、実行フェーズ中に重要ではありません定義されているため。しかし、サービス提供者が注入される構成フェーズ（すなわち、providerコンストラクタとconfigブロック）では問題ありません。

プロバイダと設定ブロックは、定義されている順に実行されます。プロバイダーがParameterServiceプロバイダの後にCarプロバイダが定義されている場合、またはconfigブロックの後に定義されている場合、これらの2つが実行された時点ではCarProviderは存在しません。

潜在的な競合状態を回避するには、ファイルパターンごとに1つのモジュールを実行する必要があります。これにより、アプリを高度にモジュラーに保ち（テストにも有益です）、ファイルの読み込み順序に気を配りません。例えば。：

angular.module('app', ['app.carService', 'app.parameterService']).config(...); 

angular.module('app.carService', []).provider('Car', ...); 

angular.module('app.parameterService', []).provider('ParameterService', ...); 

モジュールの部品は、モジュールは、子供から親に、angular.module配列階層で定義された順序で実行されます。

configブロックが独自のモジュールを必要とするかどうかは、その目的がテストの理由によって決まります。

Answer 2

プロバイダが異なるファイルに存在する可能性があります。作成した最初のモジュールに接続するだけで済みます。

あなたのマークアップは次のようになります場合：

<script src="coreModule.js"></script> 
<script src="parameterService.js"></script> 

その後、coreModule.jsで、あなたのモジュールを定義します。

angular.module('CoreModule', []) 
    .provider('Car', function() { 
     ... 
    } 

は、二番目のパラメータ（[]）は新しいを作成するために、角伝え、覚えておいてくださいモジュール。その後

、別のファイルで、あなたの他のプロバイダを宣言し、既存の「CoreModule」モジュールに添付：我々は唯一.module()に一つのパラメータを渡している

angular.module('CoreModule') 
.provider('ParameterService', ['$injector', function($injector) { 
    ... 
} 

注意してください。これはあなたのプロバイダを既存のモジュールに追加するためにangularを指示します。

Plunkr Demo