使用角度过滤器通过检测类型对对象进行排序

Question

我在读完这篇文章后试图写一个过滤器：custom angular filter

起初看起来很简单，但我遇到了这个问题。

我想通过检测类型来对对象数组进行排序，并在选择选项值中显示该排序列表。

您可以在此处查看不同的数组对象和我的代码：jsfiddle。

age 的值可以是以下类型：

1)数字

$scope.userDetails = [
    {"id":"1","name":"Name1","age":"20"},{"id":"2","name":"Name2","age":"5"},
    {"id":"5","name":"Name3","age":"15"},{"id":"4","name":"Name4", "age":"1"},
    {"id":"3","name":"Name5","age":"101"},{"id":"6","name":"Name6", "age":"51"},
];

2) 字符串

$scope.userDetails = [
    {"id":"1","name":"Name1","age":"ten"},{"id":"2","name":"Name2","age":"hundred"},
    {"id":"4","name":"Name3","age":"six"},{"id":"6","name":"Name4", "age":"one"},
    {"id":"5","name":"Name5","age":"seven"},{"id":"3","name":"Name6", "age":"hundred and one"},
];

3) 两者（同时具有字符串和数字类型）

$scope.userDetails = [
    {"id":"3","name":"Name1","age":"20"},{"id":"1","name":"Name2","age":"hundred"},
    {"id":"5","name":"Name3","age":"six"},{"id":"2","name":"Name4", "age":"1"},
    {"id":"6","name":"Name5","age":"seven"},{"id":"4","name":"Name6", "age":"hundred and one"},
];

如果不同的年龄值仅是数字类型，我希望有一个按数字排序的选择选项，如果不是，那么我想按字符串排序。

谢谢

编辑：1
我想我的问题可能让你们中的一些人感到困惑。我会在这里尝试解释清楚一点
对于 (1) 情况：
我们只有年龄 ["20","5","15","1","101","51"] 的整数值（仅显示每个对象的年龄值）。现在，当我应用过滤器进行排序时，它应该像整数比较一样进行比较，输出应该是 - ["1","5","15","20","51","101"]（所以我认为我们必须在过滤器中使用 regex 或 parseInt 将它们转换为数字并进行比较，但输出仍应为字符串。）
输入字符串，输出字符串，比较整数

对于 (2) 情况：
我们只有年龄的整数值[“十”，“百”，“六”，“一”，“七”，“百零一”]（仅显示每个对象的年龄值）。现在当我应用过滤器进行排序时，它应该像字符串比较一样比较，输出应该是 - ["hundred", "hundred and one", "one", "seven", "six", "ten"]
输入字符串、输出字符串、比较字符串

对于 (3) 情况：
我们只有年龄的整数和字符串值 ["20", "hundred", "six", "1", "7", "hundred and one"] （仅显示年龄值每个对象）。现在，当我应用过滤器进行排序时，它应该像字符串比较一样比较，输出应该是 - ["1", "20", "hundred", "hundred and one", "seven", "six"]
输入字符串、输出字符串、比较字符串

谢谢，

Answer 1

Angular 已经有一个用于排序的过滤器。我建议您不要尝试自己重写排序过滤器，而是编写一个过滤器来将您的年龄道具从字符串转换为 int ONLY 如果所有年龄值都可以转换为整数。注意，我使用的是.map() 和.some()，它们是 ES5 函数（如果支持 IE8，则需要添加 shim）。

yourModule.filter('tryToConvertAge2Int', ['$filter', function ($filter) {
   // Return filter function
   return function (items) {
      // Check if some age values cannot be converted to integers.
      var notAllIntegers = items
         .some(function (item) {
            return isNan(parseInt(item.age));
         });
      // Return list of items with age props as integers
      // if all values can be converted to integers.
      if (!notAllIntegers) {
         return items.map(function (item) {
            item.age = parseInt(age);
            return item;
         });
      }
      // Otherwise return original items.
      return items;
   };
});

然后简单地将tryToConvertAge2Int 和orderBy 链接在一起：

<div ng-repeat="item in items | tryToConvertAge2Int | orderBy:'+age' track by id"></div>