Angular ng-repeat orderBy 和 groupBy 没有正确排序答案

【问题标题】：Angular ng-repeat orderBy and groupBy not ordering properlyAngular ng-repeat orderBy 和 groupBy 没有正确排序
【发布时间】：2016-07-05 10:43:42
【问题描述】：

我正在使用 Angular 的 ng-repeat 和 groupBy 和 orderBy。我想要实现的是按 SeatNo 订购，即； 1、2、8、12，但 Angular 给我的是 1、12、2、8。

PS：我知道 SeatNo 是一个字符串，并尝试过parseInt，但这似乎不起作用

html

<tbody ng-if="::!isOnlyAllSeat" ng-repeat="(key, value) in billRaw | groupBy: 'SeatNo' | orderBy: 'SeatNo' track by key">
  <tr class="right bg-darkBlue fg-white">
    <td colspan="{{::colSpan}}"> Seat {{key==0?"ALL":key}}</td>
    <td class="right bill-col-5"><span class="label bg-white fg-black place-right">{{value.length}}</span></td>
  </tr>
  <tr ng-repeat="item in value  | orderBy: 'ClassCode' " class="fg-darkBlue">
    <td class="bill-col-1 middle">{{item.ClassCode}}</td>
    <td class="text-left bill-col-2 middle">
      <span class="">{{item.Name}}</span>
      <div class="note-tag-list" ng-if="item.Options">
        <div class="note-tag-item note-tag" ng-repeat="question in item.Options track by question.Question_ID">
          <div ng-repeat="option in question.Options track by option.Option_ID">
            <a href class="label info note-tag">{{option.Option}}
              <small class="price-tag" ng-if="option.ActualPrice !== '0.00'">+{{option.ActualPrice | currency}}</small>
            </a>
          </div>
        </div>
      </div>
    </td>
    <td class="text-left bill-col-5 middle">
      <div>{{item.ActualPrice | currency}}</div>
      <div><small ng-if="item.OptionsTotalActualPrice !== 0">+{{item.OptionsTotalActualPrice | currency}} : Add-on </small></div>
      <div ng-if="item.DiscountAmt>0"><span class="fg-red">({{( getDiscount(item) | currency)}})</span> : {{((item.ActionTypeID == 1)? item.DiscountAmt+'% OFF':item.CodeName)}}</div>
      <div ng-if="item.ActionTypeID == 1">{{item.CodeName}}</div>
    </td>
  </tr>
</tbody>

这是我的billRaw 数组。

注意 - 它是按 SeatNo 排序的

[
 {"OrderItemID": "329277",
  "Name": "Mexican Tacos",
  "Delivered": "0",
  "ShortName": "MEXICAN TACOS",
  "Price": "8.0000",
  "MenuItemID": "2318",
  "SeatNo": "1",
  "SequenceNo": "37",
  "AlcoholCheck": "0",
  "OStatusID": "2",
  "Notes": "",
  "Options": [],
  "OptionsTotal": 0,
  "OptionsTotalActualPrice": 0,
  "ActualPrice": "8.00",
  "CodeID": 0,
  "DiscountAmt": 0,
  "ActionTypeID": 0,
  "CodeName": 0,
  "ReductionType": 0,
  "PayerSeq": "0",
  "PriceType_ID": "1",
  "ParentClassName": "Tacos",
  "NetPrice": 8,
  "ExtItem_ID": "J9X79NS28M1ZY",
  "ExtOrderItem_ID": null,
  "Code": null
 },
{
  "OrderItemID": "329278",
  "Name": "Mexican Tacos",
  "Delivered": "0",
  "ShortName": "MEXICAN TACOS",
  "Price": "8.0000",
  "MenuItemID": "2318",
  "SeatNo": "2",
  "SequenceNo": "38",
  "AlcoholCheck": "0",
  "OStatusID": "2",
  "Notes": "",
  "Options": [],
  "OptionsTotal": 0,
  "OptionsTotalActualPrice": 0,
  "ActualPrice": "8.00",
  "CodeID": 0,
  "DiscountAmt": 0,
  "ActionTypeID": 0,
  "CodeName": 0,
  "ReductionType": 0,
  "PayerSeq": "0",
  "PriceType_ID": "1",
  "ParentClassName": "Tacos",
  "NetPrice": 8,
  "ExtItem_ID": "J9X79NS28M1ZY",
  "ExtOrderItem_ID": null,
  "Code": null
 },
 {
  "OrderItemID": "329276",
  "Name": "Mexican Tacos",
  "Delivered": "0",
  "ShortName": "MEXICAN TACOS",
  "Price": "8.0000",
  "MenuItemID": "2318",
  "SeatNo": "8",
  "SequenceNo": "36",
  "AlcoholCheck": "0",
  "OStatusID": "2",
  "Notes": "",
  "Options": [],
  "OptionsTotal": 0,
  "OptionsTotalActualPrice": 0,
  "ActualPrice": "8.00",
  "CodeID": 0,
  "DiscountAmt": 0,
  "ActionTypeID": 0,
  "CodeName": 0,
  "ReductionType": 0,
  "PayerSeq": "0",
  "PriceType_ID": "1",
  "ParentClassName": "Tacos",
  "NetPrice": 8,
  "ExtItem_ID": "J9X79NS28M1ZY",
  "ExtOrderItem_ID": null,
  "Code": null
 },
 {
  "OrderItemID": "329275",
  "Name": "Mexican Tacos",
  "Delivered": "0",
  "ShortName": "MEXICAN TACOS",
  "Price": "8.0000",
  "MenuItemID": "2318",
  "SeatNo": "12",
  "SequenceNo": "35",
  "AlcoholCheck": "0",
  "OStatusID": "2",
  "Notes": "",
  "Options": [],
  "OptionsTotal": 0,
  "OptionsTotalActualPrice": 0,
  "ActualPrice": "8.00",
  "CodeID": 0,
  "DiscountAmt": 0,
  "ActionTypeID": 0,
  "CodeName": 0,
  "ReductionType": 0,
  "PayerSeq": "0",
  "PriceType_ID": "1",
  "ParentClassName": "Tacos",
  "NetPrice": 8,
  "ExtItem_ID": "J9X79NS28M1ZY",
  "ExtOrderItem_ID": null,
  "Code": null
 }
]

编辑

我已经修改了 billRaw 以便 SeatNo 的 type 是 number 。但是还是不行

_.forEach($scope.billRaw, function(value,key) {
     value.SeatNo = parseInt(value.SeatNo);
});

【问题讨论】：

它是字符串值，因此以这种方式排序。如您所说，您需要将其转换为 int 。为什么 parseInt 不起作用？
parseInt on orderBy 无效，parseInt on groupBy 只给出数组索引 0、1、2、3。
你如何解析它，你应该在做orderBy之前在实际的json数组上做它。
我已将 SeatNo 更改为 int ` _.forEach($scope.billRaw, function(value,key) { value.SeatNo = parseInt(value.SeatNo); });` 但它没有不工作

标签： javascript arrays angularjs angularjs-ng-repeat angularjs-orderby

【解决方案1】：

你可以试试跑

$.each(billRaw, function(i) {billRaw[i].SeatNo = parseInt(billRaw[i].SeatNo)});

在控制器中，它将座位号转换为数字。那么它应该可以正常工作。

【讨论】：

我已将 SeatNo 的类型更改为 number 。但是还是不行
尝试删除 groupby 子句