AngularJS排序q。来自服务的所有对象数组都不起作用

时间:2018-01-30 20:51:42

标签: javascript arrays angularjs sorting javascript-objects

我已经看过很多帖子,但由于某种原因我继续遇到问题。我用$ q.all返回多个承诺。每个返回的承诺(来自不同供应商)返回相同格式的对象数组。返回所有内容后,然后将所有内容处理为单个对象数组,然后我需要根据三个SORT值之一对对象数组进行排序:(vendor, price, price_estimate)

但是当它返回我的控制器时,没有任何东西被排序。

Sample Object:
    {
       "vendor" : "Aaa Company",
       "product" : "This prod",
       "description" : "this cool prod",
       "price" : 27.50,
       "price_estimate" : 23.25,
       "category" : "tool",
       ...
    }

.factory('Products', function($http,$q,promise1,promise2,promise3,promise4,promise5) {
  var prods = [] ;

  function sortProds(key) {
    prods.sort(function(a,b) {
      if (key == "vendor") {
        return ((x<y) ? -1 : ((x > y) ? 1: 0)) ;
      } else {
        return parseFloat(a.key) - parseFloat(b.key) ;
      }
    }) ;
  }

  function getProds() {
     prods = [] ;      
     $q.all([promise1(),promise2(),promise3(),promise4(),promise5()]).then(function(response){ 
        var z=0 ;
        // process all results, ie: [0][{a:1,b:2,c:3},{a:4,b:5,c:6}], [1]:[{a:7,b:8,c:9}
        for (var y=0;y<response.length;y++) {

          // process individual result,ie: [{a:1,b:2,c:3},{a:4,b:5,c:6}]
          for (var x=0;x<response[y].length;x++) {  
            response[y][x].prodID = z++ ;  // reset prodID
            prods.push(response[y][x]) ; 
          }
        }

        // sort option could be 'vendor','price','price_estimate'
        prodInfo.sortBy = getDB("prod_sortOption") ;  
        sortProds(prodInfo.sortBy) ;
      });
  }

  return {
    all: function() {
      return [prods,prodInfo.sortBy] ;
    }
  }
})

因为我无法完成上述工作,所以我尝试在控制器中对返回的结果进行自动排序,但它也无效。在我的控制器中:

  $scope.doSort = function(key,prodList) {
    prodList.sort(function(a,b) {
      var x = a[key]; var y = b[key] ;
          if (key == "vendor") {
            return ((x<y) ? -1 : ((x > y) ? 1: 0)) ;
          } else {
            return parseFloat(a.key) - parseFloat(b.key) ;
          }
    }) ;
    return prodList ; 
  }

  var returnedProds = Products.all() ; 
  $scope.prods = $scope.doSort(prodInfo.sortBy,returnedProds[0]) ;

  // $scope.prods is what is used to in my template to populate the web view.

但是,如果webview中的用户对点击按钮进行了手动排序,则点按ng-click="doSort('price',prods)"它按预期工作...但是它不同于doSort不能正常工作自动排序的返回结果。

我希望这一切都有道理。我无法弄清楚为什么它没有在服务中排序......或者在返回结果的自动排序期间再次......但是当手动完成时它会起作用。啊!

1 个答案:

答案 0 :(得分:0)

除非我对您的实施感到困惑,否则我建议您不要使用两个完全相同的功能。使用Products.sortProds()进行手动排序和自动排序。

这是我的工厂。我模拟了响应数组,从每个promise中返回1个产品对象。我用一个设置为price的静态字符串覆盖了getDB()调用。另外,我暴露了每个对象和函数,以便从我的组件的$ onInit调用getProds(),因为我没有看到你的调用。所以唯一的区别就是同步性。

工厂方法

function ProductsFactory() {
    return {
        prods: [],
        prodInfo: {},

        all: function() {
            return [this.prods,this.prodInfo.sortBy] ;
        },
        sortProds: function(key) {
            this.prods.sort(function(a,b) {

                var x = a[key]; var y = b[key] ;

                if (key == "vendor") {
                    return ((x<y) ? -1 : ((x > y) ? 1: 0)) ;
                } else {
                    return parseFloat(a[key]) - parseFloat(b[key]) ;
                }
            }) ;
        },

        getProds: function() {
            this.prods = [] ;      
            var response = [
                [{
                    "vendor": "Aaa Company",
                    "product" : "This prod",
                    "description" : "this cool prod",
                    "price" : 27.50,
                    "price_estimate" : 23.25,
                    "category" : "tool",
                 }],
                 [{
                    "vendor": "Zaa Company",
                    "product" : "This prod",
                    "description" : "this cool prod",
                    "price" : 22.90,
                    "price_estimate" : 23.25,
                    "category" : "tool",
                 }],
                 [{
                    "vendor": "Haa Company",
                    "product" : "This prod",
                    "description" : "this cool prod",
                    "price" : 20.20,
                    "price_estimate" : 23.25,
                    "category" : "tool",
                 }],
                 [{
                    "vendor": "Gaa Company",
                    "product" : "This prod",
                    "description" : "this cool prod",
                    "price" : 96.69,
                    "price_estimate" : 23.25,
                    "category" : "tool",
                 }],
                 [{
                    "vendor": "Waa Company",
                    "product" : "This prod",
                    "description" : "this cool prod",
                    "price" : 69.69,
                    "price_estimate" : 23.25,
                    "category" : "tool",
                 }],
            ];

            var z=0 ;
            // process all results, ie: [0][{a:1,b:2,c:3},{a:4,b:5,c:6}], [1]:[{a:7,b:8,c:9}
            for (var y=0;y<response.length;y++) {
                // process individual result,ie: [{a:1,b:2,c:3},{a:4,b:5,c:6}]
                for (var x=0;x<Object.keys(response[y]).length;x++) {  
                    response[y][x].prodID = z++ ;  // reset prodID
                    this.prods.push(response[y][x]) ; 
                }
            }

            // sort option could be 'vendor','price','price_estimate'
            //prodInfo.sortBy = getDB("prod_sortOption") ;  
            this.prodInfo.sortBy = 'price';
            this.sortProds(this.prodInfo.sortBy) ;
        },
    }

除非您这样做,否则价格不会排序:

return parseFloat(a[key]) - parseFloat(b[key]) ;

a.key =&gt;一个[关键]
b.key =&gt; B [键]

您还没有在sortProds()方法中定义变量 x y

var x = a[key]; var y = b[key] ;

<强>实施

this.$onInit = function() {
    Products.getProds();
    Products.sortProds(Products.prodInfo.sortBy);
    $scope.prods = Products.all()[0];
    $scope.Products = Products; // expose to vm scope
    console.log($scope.prods); // logs sorted array of product objects
  }

我只有30分钟的时间,所以如果我的答案不足,我很抱歉。但对我来说,它有效。如果这对您仍然有用,请确保您的承诺以正确的格式(2d数组)返回正确的数据。