私の概念実証をご覧ください: http://plnkr.co/edit/y3pzFv?p=preview .
2 つのモジュール間でプロバイダーを構成するにはどうすればよいですか?
概要: サービスを一般化し、複数のインスタンスを少し異なる方法で構成しようとしています。
現在、再利用できるように一般化したい Angular Services (factory) がたくさんあります。私の概念実証では、AngularJS 1.3 アプリを 2 つのモジュール 'bob' と 'joe' に分割しようとしています。各モジュールは、food と呼ばれる構成可能な変数を持つプロバイダーを共有する必要があります。再利用可能なサービスを定義し、モジュールごとに個別のインスタンスを作成しようとしています。
プロバイダーに関する Angular のドキュメントを読みました。私が理解していることから、プロバイダーを使用すると、構成可能な部分を .config() に抽出できます。私は何を間違っていますか?Bob's Food が Banana であることを期待しますが、2 番目に構成された Joe's Food は Bob's Food を上書きしています。これにより、Food プロバイダーは「bob」モジュールと「joe」モジュールのそれぞれに対して新しいインスタンスを作成していないと思われます。
私はAngularJS v1.3.15を使用しています
index.html
<div ng-controller="BobCtrl">Bob's Food: {{ providerInstance.get() }}</div>
<div ng-controller="JoeCtrl">Joe's Food: {{ providerInstance.get() }}</div>
app.js
angular.module('shared').provider('Food', function() {
var _food = 'Default';
this.set = function(food) { _food = food; }
this.$get = function() {
return {
get: function() {
return _food;
}
}
};
});
angular.module('bob').config(function(FoodProvider) {
FoodProvider.set('Banana');
});
angular.module('bob').controller('BobCtrl', function($scope, Food) {
$scope.providerInstance = Food;
});
angular.module('joe').config(function(FoodProvider) {
FoodProvider.set('Apple');
});
angular.module('joe').controller('JoeCtrl', function($scope, Food) {
$scope.providerInstance = Food;
});