Javascript Sortby嵌套ng重复

我想按price属性对响应数据进行排序，问题是有些项被定义为数组，每个项都有一个price，我想对整个列表进行排序。我现在的问题是处理类型2（嵌套ng repeat） 当前，类型1和3显示正确排序，然后类型2未排序

HTML:

JSON:

---

我认为这应该很简单。您编写的排序方法需要中间if条件（即type=2），因为它是一个数组。所以这个方法应该返回数组中最大的价格，对吗？你可以这样写。您应该在从api获得响应之后，在html上显示该函数之前调用该函数

$scope.sortItems = function(responseObj){
   var output;
   for(item in responseObj){
      if(item.type == 1){
         item.finalPrice = item.fedex.price;
      }
      else if(item.type == 2){
         item.ups.sort(function(a, b){ return b.price - a.price });
         item.finalPrice = item.ups[0].price;
      }
      else{
        item.finalPrice = item.price;
      }
   }
}
//The above method will add a new attribute name finalPrice denoting the prices. For type2, the max price of all objects in ups will be taken. So this will make sure we're comparing prices across all types.

在上面的div中，您可以使用orderBy管道根据最终价格对项目进行排序。在我看来，你不再需要排序功能了

<li ng-repeat="x in response.data | orderBy:finalPrice">                                  
                <div> <!--You dont need to check type=1 or 3 anymore as all the data has finalPrice attribute. -->
                    <div class="product flex-container row">
                            <div>{{x.finalPrice}}</div>                          
                    </div>
                </div>
                <div class="product flex-container row">
                        <div>{{x.finalPrice}}</div>                         
                </div>
                <div class="product flex-container row" ng-if="x.type=='2'" ng-repeat="obj in x.ups">                                
                        <div>{{obj.price}}</div>                                                                     
                </div>
            </li>

{{x.finalPrice}}
{{x.finalPrice}}
{{obj.price}}

---

每个对象都有一个新属性作为最终价格。type2还有一个属性作为type2同级，它将是其ups数组中所有对象的最大值。现在你可以对最终价格进行排序了。这应该可以解决问题。

按照您构建它的方式，您将始终将

类型2

产品放在一起，因为它们都在内部

ng repeat

中一次处理。如果需要的话，@sagar agrawal的答案应该是可行的

但是，如果您打算在

产品7

（价格14）之前显示

产品9

（价格13），则需要将数据展平以便进行此处理，并且只需重复一次

ng

。可以这样做：

//javascript
const combinedJson = [];
for (const data of json) {
  if (data.type === 2) {
    for (const innerData of data.ups) {
      combinedJson.push({type: 2, data: innerData, price: innerData.price});
    }
  }
  else {
    if (data.type == 3) {
      data.price = data.fedex.price;
    }
    combinedJson.push(data);
  }
}

$scope.sortprice = function (item) {
  return item.price;
};

<ul>                
  <li ng-repeat="x in combinedJson | orderBy:sortprice">
    <div class="product flex-container row">
      <div>{{x.price}}</div>                          
    </div>
  </li>
</ul>

现在，

combinedJson

可以在

ng repeat

中使用，如下所示：

//javascript
const combinedJson = [];
for (const data of json) {
  if (data.type === 2) {
    for (const innerData of data.ups) {
      combinedJson.push({type: 2, data: innerData, price: innerData.price});
    }
  }
  else {
    if (data.type == 3) {
      data.price = data.fedex.price;
    }
    combinedJson.push(data);
  }
}

$scope.sortprice = function (item) {
  return item.price;
};

<ul>                
  <li ng-repeat="x in combinedJson | orderBy:sortprice">
    <div class="product flex-container row">
      <div>{{x.price}}</div>                          
    </div>
  </li>
</ul>

{{x.price}}

您能分享一下json响应的样子吗？想了解类型2。是的，没问题，我编辑了问题并在下面添加了我的答案，看一看，让我知道情况如何。或者如果你需要别的什么。谢谢！这个解决方案没有很好地工作，因为我添加了一个部分JSON问题。在第2项中，解决方案确实起作用，但是在第二项中，解决方案不再相关。如果我的帖子中的第一个解决方案解决了您的问题，请考虑将其标记为答案。谢谢我希望您了解这种方法的工作原理。

<ul>                
  <li ng-repeat="x in combinedJson | orderBy:sortprice">
    <div class="product flex-container row">
      <div>{{x.price}}</div>                          
    </div>
  </li>
</ul>