AngularJs Custom orderBy有两个参数

Question

我在创建自定义orderBy过滤器的正确语法方面遇到了问题。 如果需要一个参数（在ng-repeat中将项目作为迭代器），我没有问题。 你如何传递第二个参数。 我努力了：

  <div ng-repeat="item in items | orderBy:myCustomSort:mySecondParameter"></div>

但是，如果我在myCustomSort函数中放置一个中断，mySecondParameter是未定义的。 另外你可以让orderBy反转顺序，如果是这样你在哪里坚持“反向”参数。

谢谢。

Answer 1

您可以创建自定义过滤器以按多个键过滤

在你的js文件中： -

App.filter('multiOrderBy', ["$filter", function ($filter) {
return function (items, key1, key2) {
    var newItems = [];
    if(!items || !items.length)
        return newItems;
    function sortKey1(obj) {
        return obj[key1].toLowerCase();
    }
    function sortKey2(obj) {
        return obj[key2].toLowerCase();
    }
    if(key1)
        newItems = $filter('orderBy')(items, sortKey1);
    if(key2)
        newItems = $filter('orderBy')(newItems, sortKey2);
    return newItems;
  }
}]);

在HTML中： -

<div ng-repeat="item in items | multiOrderBy: 'name': 'category'"></div>

在我的情况下项目是： -

$scope.items = [
        {"name":"ABC", "category":"Project"},
        {"name":"xyz", "category":"Project"},
        {"name":"red", "category":"Color"},
        {"name":"Blue", "category":"Color"}
    ];

所以过滤后的数组将是： -

$scope.items = [
        {"name":"Blue", "category":"Color"},
        {"name":"red", "category":"Color"},
        {"name":"ABC", "category":"Project"},
        {"name":"xyz", "category":"Project"}
    ];

Answer 2

请查看： http ： //docs.angularjs.org/api/ng.filter ： orderBy 。 orderBy过滤器的参数可以是字符串，函数或数组。 所以你可以写：

<div ng-repeat="item in items | orderBy:[myCustomSort,mySecondParameter]"></div>

按两个属性对数据进行排序。

作为一个例子，请看这个小提琴： http ： //jsfiddle.net/kFHXL/如果你点击“年龄”你可以看到数据按名称排序，然后按年龄排序。

Answer 3

我找不到将附加参数传递给sort函数的解决方案。 相反，我只是创建了一个appendItemFilter，它接受我想在customSort中引用的参数并将其附加到每个项目。 然后我可以直接在项目中引用它。 所以：

<div ng-repeat="item in items | appendItem:mySecondParameter | orderBy:myCustomSort"></div>