anglejsアプリケーション...サービスまたは工場でコントローラ、サービス、および工場を適切に構成する方法はありますか？

Question

「anglejs」の考え方（Angular 1）の周りに頭を抱えて作業していましたが、小さな個人的なプロジェクトを通して自分の道を進むにつれて、私は比較的よく理解しています。私はそれがうまくいかないためにではなく、私のアプリケーションでデータを設定する適切な方法を知りたいと思います。

categories.json 
products.json 
vendors.json 

これらは、（私が後でデータベースから取得しますが、今のために簡略化しています）のデータを保持する：私は3つのJSONファイルを持っている

：

基本的な状況はこれです。

私は基本的にすべての "製品"（これは別に宣言したJSクラスです）を保持する変数を形成できるように、これら3つのファイルすべてからデータをロードする必要があります。

私は1つのコントローラ（以下、関連するコード）内のデータを格納することによって始まっ：

myApp.controller('productListController', ['$scope', '$http', '$q', function ($scope, $http, $q) { 

var promises = []; 
promises.push(getCategories($http)); 
promises.push(getVendors($http)); 
promises.push(getProducts($http)); 

$q.all(promises).then(function (response) { 
    //categories = response[0]; 
    //vendors = response[1]; 
    //products = response[2]; 
    $scope.products = createProductList(response); 
    $scope.vendors = response[1].data; 
    $scope.vendorChecked = getCheckedVendors($scope.vendors); 
}) 

これがうまく働いたが、私はこれを移動しようとする私を導いた、私は他のビューでは、このデータを必要とすることを実現サービスにコード化する。

これは、コントローラがデータを取得してProductListController $ scopeに保存できるようになったことをコントローラが知る方法がわからないという問題です。

私は、例えばへの道を持っている必要があります：

myApp.service('ProductService', ['$http', '$q', function ($http, $q) { 

self = this; 
var promises = []; 
promises.push(getCategories($http)); 
promises.push(getVendors($http)); 
promises.push(getProducts($http)); 

$q.all(promises).then(function (response) { 
//These three I would like to update in ProductListController 
//when it is done. 
    self.products = createProductList(response); 
    self.vendors = response[1].data; 
    self.vendorChecked = getCheckedVendors(self.vendors); 
}) 

これは取るべき正しいアプローチですか？もしそうなら、どのように私は、コントローラは、サービスがデータをフェッチ行われ、例えば、保存されていることを知らせることができます：

$scope.products = ProductService.products; 
$scope.vendors = ProductService.vendors; 
$scope.categories = ProductService.categories; 

これも、正しいアプローチですか？私が考えた別のアプローチは、サービスの代わりに工場を使うことでした。

return { 
    getProducts: function() { 
     //http get request code in here 
     return promise 
    }, 
    getVendors: function() { 
     //http get request code in here 
     return promise 
    }, 
    getCategories: function() { 
     //http get request code in here 
     return promise 
    }, 
    getAllData: function() { 
    //in here I want to use the three promises in the 3 functions above 
    //but I am not able to call them from here. If I was able to do that 
    //then I could call this method from ProductListController and get the 
    //data that way. 
    } 

これは長かったが、私が試したさまざまなことを説明したかったのですが、私は別の問題がありました。私はそれを働かせることができることを知っているが、私は正しい方法、または正しい方法の2つを学びたい。 - これは$ HTTP transformResponce https://docs.angularjs.org/api/ng/service/ $ HTTPにtranforms置くことを検討

var promises = []; 
promises.push(getCategories($http)); 
promises.push(getVendors($http)); 
promises.push(getProducts($http)); 

return $q.all(promises) 

あなたはまた、各コントローラにあなたがcreateProductList、getCheckedVendorsを呼び出す必要が満たされていないという場合は、次の

Answer 1

はいつも約束を返すことをお勧めします。 あなた自身の約束を作成することもできます。 （$ q.deferを使用してhttps://docs.angularjs.org/api/ng/service/ $ q）。

実際にサービスや工場を使用することは問題ありません。これは工場である：

var factory = {}; 
factory.getProducts: function() { 
     return promise 
} 
factory.getCategories: function() { 
     return promise 
} 
factory.getVendors: function() { 
     return promise 
} 
factory.getAllData: function() { 
    var promises = []; 
    promises.push(factory.getProducts()); 
    promises.push(factory.getCategories()); 
    promises.push(factory.getVendors()); 

    return $q.all(promises) 
} 
return factory; 

そして、あなたがちょうど持っているのcontrolerで：。 MyFactory.getAllData（）を（...）