web-dev-qa-db-ja.com

Angularjs：複数の$ resource URL /データソースを提供するサービス？

私はAngular service/providerを持っていますが、これはjsonデータを私のコントローラーに提供します。

    angular.module('myApp.services', ['ngResource']).
      factory("statesProvider", function($resource){
      return $resource('../data/states.json', {}, {
        query: {method: 'GET', params: {}, isArray: false}
      });
    });

しかしまた、別のファイルから同じコントローラーにjsonデータを提供する必要がありますcounties.json。

両方のファイルをコントローラーに提供するサービスを作成する方法はどこで確認できますか？

angularjscontroller
44
Henry Zhu

サービスを更新して、単一ではなくリソースのハッシュを返すことができます。

_angular.module('myApp.services', ['ngResource']).
  factory("geoProvider", function($resource) {
    return {
      states: $resource('../data/states.json', {}, {
        query: { method: 'GET', params: {}, isArray: false }
      }),
      countries: $resource('../data/countries.json', {}, {
        query: { method: 'GET', params: {}, isArray: false }
      })
    };
  });
_

関数名の最後に.query()を追加して使用できます。つまり、geoProvider.states.query()とgeoProvider.countries.query()と_myApp.services_をコントローラーに挿入する必要があります。 、次にgeoProviderサービスをコントローラー自体にも注入します。

94
Dmitry Evseev

両方のファイルがロードされたときに、何らかのコードを実行することを想定しています。 Promiseはこれに非常に適しています。リソースが約束を返すとは思いませんが、単純なajax呼び出しに$ httpサービスを使用できます。

ここでは、2つのデータファイルごとに1つのサービスを定義し、両方のファイルの読み込みが完了すると満たされるプロミスを返す3番目のサービスを定義します。

factory('states',function($http) {
    return $http.get('../data/states.json');
}).
factory('countries',function($http) {
    return $http.get('../data/countries.json');
}).
factory('statesAndCountries', function($q, states, countries) {
    return $q.all([states, countries]);
});

次に、コントローラーで：

statesAndCountries.then(function(data) {
    var stateData = data[0];
    var countryData = data[1];
    // do stuff with stateData and countryData here
});
9
Karen Zilles