javascript - さまざまな約束からのAngularコンストラクトViewModel

Question

私のAngularプロジェクトには、製品の配列を返すPromiseがあります:

{"Products":[{"Code":123},{"Code":456}]}

次に、製品コードごとに、Price と Quantity をそれぞれ返す 2 つの Promise を呼び出す必要があります。

私は ui-router を使用しており、解決時の現在の実装コードは次のとおりです。

$stateProvider.state('root.products', {
                    abstract: true,
                    url: '/products',
                    template: '<div data-ui-view=""></div>',
                    resolve: {
                        products: ['ProductsService', function (ProductsService) {
                            return ProductsService.getProducts()
                                .then(function (response){
                                    var data = response.data;
                                    return data.Products.map(function (product) {

                                        var viewModelProduct = {};

                                        angular.copy(product, viewModelProduct);

                                        //get Price for Each Product
                                        ProductsService.getPrice(product.Code)
                                            .then(function (response) {
                                                viewModelProduct.Price = response.data.Info.Price;
                                            })

                                        //get Quantity for Each Product
                                        ProductsService.getQuantity(product.Code)
                                           .then(function (response) {
                                               viewModelProduct.Quantity = response.data.Info.Quantity;
                                           })

                                        return viewModelProduct;
                                    });
                                });
                                }]
                        }
                        })

うまくいきますが、私の質問は、もっとうまく書けるかどうかです。$qandの使用について読みましたが、$q.allそれらの使用方法がよくわかりません。上記のコードをより適切かつ安全に書く方法はありますか??

よろしくお願いします。