Question

我读过几篇关于角度承诺的文章，但我仍然觉得它在我当前的要求中实现它并不是很舒服，但在我的一个页面中已经不可避免。

问题：我的数量下拉列表显示为空白，我确信它可以使用promise处理。

 <div ng-show="product[0].sizeQtyPrice">
    <div>Qty
       <select ng-model="product.selectedQty" ng-options="value for value in product.selectedQtyOptions" ng-change="onQtyChanged(product[0].id, product[0].selectedQty)"></select>
     </div>
 </div>

我的控制器：

var ProductDetailController = function($scope,$http){

    $http.get("/get_product_details/?prod_id=1")
        .success(function (response) {
            $scope.product = response;
            $scope.onSizeSelected($scope.product[0].id, $scope.product[0].sizeQtyPrice[0]);
        }).error(function(){
            console.log('Error happened ... ');
        });


    //original code starts here
    $scope.getItemQtyPrice = function(sizeQtyPrice, qty) {
      var pricePerItem = sizeQtyPrice.mrp * ( 1 - sizeQtyPrice.discountPercent / 100);
      var totalItemPrice = qty * pricePerItem
      console.log('Total price for ' + qty + ' qty is ' + totalItemPrice);
      return totalItemPrice;
    };

    $scope.onSizeSelected = function(productId, sizeQtyPrice){
      console.log('size selected ...' + sizeQtyPrice);
      $scope.updateSelectedProductBySizeSelected(productId ,sizeQtyPrice);
    };


    $scope.onQtyChanged = function(productId, qty){
      $scope.updateSelectedProductByQtySelected(productId, qty);
    };

    $scope.updateSelectedProductBySizeSelected = function(productId, sizeQtyPrice)
    {
    var item = _.findWhere($scope.product, { 'id': productId } )
    if (item != undefined)
    {
      item.selectedQtyOptions = _.range(1, sizeQtyPrice.qty + 1);
      item.selectedSize = sizeQtyPrice.size;
      item.selectedQty = item.selectedQtyOptions[0];

      var sizeQtyPrice = _.findWhere(item.sizeQtyPrice , {"size" : item.selectedSize});
      item.totalPriceForSelectedQtyAndSize = $scope.getItemQtyPrice(sizeQtyPrice, item.selectedQty);
      item.totalWithoutDiscount = sizeQtyPrice.mrp * item.selectedQty;
      item.pricePerPiece = item.totalPriceForSelectedQtyAndSize / item.selectedQty;
    }
    };

    $scope.updateSelectedProductByQtySelected = function(productId, qty){
    var item = _.findWhere($scope.product, { 'id': productId } )

    if (item != undefined)
    {
      item.selectedQty = qty;

      var sizeQtyPrice = _.findWhere(item.sizeQtyPrice , {"size" : item.selectedSize});
      item.totalPriceForSelectedQtyAndSize = $scope.getItemQtyPrice(sizeQtyPrice, item.selectedQty);
      item.totalWithoutDiscount = sizeQtyPrice.mrp * item.selectedQty;
      item.pricePerPiece = item.totalPriceForSelectedQtyAndSize / item.selectedQty;
    }
    };

};

mainApp.controller('ProductDetailController',['$scope','$http',ProductDetailController]);

以下是product JSON：

[
{
"selectedQtyOptions": [],
"selectedSize": "",
"description": "taxiing",
"selectedQty": "1",
"title": "nationally",
"brand": "Brand2",
"product_identifier_type": "SKU",
"images": [
    {
        "image0": "/media/products/bb61e8ae422b736ff6c1b9562cbde883.jpg"
    }
],
"sizeQtyPrice": [
    {
        "discountAttributes": "Jung fords redskin richest pearl paperweight careen confides backstage gushing",
        "measureUnit": "mm",
        "discountPercent": 5,
        "mrp": 8269,
        "qty": 2,
        "size": 62
    },
    {
        "discountAttributes": "snitched wisps unambiguously harshest clothed famished spec triathlon Ethelred addicts",
        "measureUnit": "Kg",
        "discountPercent": 10,
        "mrp": 5644,
        "qty": 6,
        "size": 92
    },
    {
        "discountAttributes": "committal forming Welsh mawkishly swapped merchandize brawn demises emailed UCLA",
        "measureUnit": "Kg",
        "discountPercent": 3,
        "mrp": 7106,
        "qty": 5,
        "size": 32
    }
],
"product_identifier": "8e4e9389-6c46-4dc8-8716-0c7d2e580d3e",
"id": 1
}
]

Answer 1

您正在产品[0]上设置selectedQtyOptions，但您正尝试从产品中读取它。我没有测试它，但我相信这应该工作。

 <select ng-model="product.selectedQty" ng-options="value for value in product[0].selectedQtyOptions" ng-change="onQtyChanged(product[0].id, product[0].selectedQty)"></select>

或者

$scope.updateSelectedProductBySizeSelected = function(productId, sizeQtyPrice)
....
if (item != undefined)
{
  $scope.selectedQtyOptions = _.range(1, sizeQtyPrice.qty + 1);
  $scope.selectedSize = sizeQtyPrice.size;
  $scope.selectedQty = item.selectedQtyOptions[0];
}
...

仅供参考，您已经在使用承诺。 http（）。success是一个promise，所以你只是在获取数据后才更新它。另一件事，我发现你的方法有点令人困惑，老实说，我不明白你想要做什么。只是一些建议：

不要传递ID，然后在JSON数据中查找条目。这是浪费时间。如果你可以直接传递对象。
将ng-model变量与GET响应分开。这让人很困惑。

在ng-options的产品详细信息页面上实施PROMISE

1 个答案: