在特殊情况下使用Angularjs OrderBy进行排序

Sorting with Angularjs OrderBy in special cases

本文关键字：排序 OrderBy Angularjs 在特殊情况下      更新时间：2023-09-26

我有一些数据，我正试图使用Angular的orderBy过滤器在表中进行排序。这是我试图排序的数据。

[
  {
    "name":"John Doe",
    "room":"1M-103",
  },
  {
    "name":"Joe Schmoe",
    "room":"12M-353",
  },
  {
    "name":"Bob Guy",
    "room":"13M-546",
  },
  {
    "name":"Another Person",
    "room":"12M-403",
  },
  {
    "name":"Fred No-name",
    "room":"3M-204",
  },
[

所以按名字排序很好。然而，按房间分类是另一个问题。我用完全相同的方式排序。以下是我排序后喜欢的样子：

1M-103
3M-204
12M-353
12M-403
13M-546

它实际上在排序后的样子是这样的：

12M-353
12M-403
13M-546
1M-103
3M-204

有人能帮忙吗？我知道为什么是这样排序的，因为它是一个数字接一个数字并正确排序的，但有人找到了某种方法来获得稍微更好的排序吗？

您可以创建一个自定义分类器来完成此操作。

<li ng-repeat="item in items | orderBy:mySorter">{{item}}</li>
$scope.mySorter = function (item) {
    return Number(item.room.split('-')[0].replace('M', ''));
}

我还为您创建了一个演示。

更新

您也可以使用Regex:

$scope.mySorter = function (item) {
    return Number(item.room.replace(/[^'d]/g, ''));
}

演示

实际上sza的答案并不完全有效，因为它只考虑了字母'M'之前的数字。因此，以12M开头的所有内容都将读作"12"，并被视为相等。所有12M都将出现在11M之后和13M之前，但随后将在其他12M中以随机顺序显示。

我想出了这个代码：

<li ng-repeat="item in items | orderBy:mySorter">{{item}}</li>
$scope.mySorter = function (item) {
    return Number(item.residenceRoom.replace('M', '.').replace('-', ''));
}

它根据M点前的数字和M点后的数字创建一个十进制数字。因此12M-353将为"12.353"，12M-403为"12.403"，因此它们将被正确排序。

我看到的唯一问题是房间号码是否总是3位数。例如，一个假设的房间1M-2将被排序为"1.2"，而房间1M-103将为"1.103"，因此房间2将被排序在房间103之后。但你可以很容易地解决这个问题，用3位数字格式化所有房间，例如1M-002房间。

相关文章：