对 ng-repeat 进行函数调用的动态 orderBy angularjs

Question

我正在尝试动态更改 ng-repeat 顺序。

我有一个包含 2 个字符串的列表，它们假设按属性个对象排序，一个函数用于计算对象的总参与度。

控制器

/**
 * the available filters for the sort
 * @type []
 */
$scope.orders = [
    {name: "Newest", order: '-created_at'},
    {name: "Oldest", order: 'created_at'},
    {name: "Most Engaged", order: 'totalEngagement'}
];

$scope.totalEngagement = function (content) {
    total = 0;
    if (content.likes_count)
        total -= content.likes_count;
    if (content.comments_count)
        total -= content.comments_count;
    return total;
};


/**
 * Set the chosen order to sort the buzz content by
 * @param order - the chosen order
 */
$scope.setOrder = function (order) {
    $scope.selectedOrder = order;
};

风景

 <div ng-init="setOrder(orders[0])" class="col-sm-6 col-md-4 col-lg-3 mix "
     ng-repeat="content in campaign.content | orderBy:selectedOrder.order">

现在，属性的 2 顺序工作正常，但当我选择顺序时该功能不会触发。如果我输入的不是 selectedOrder.order，函数名称，则顺序可以正常工作。

我添加了一个 plunker 示例

http://plnkr.co/edit/YAgiDq0PJyqOO3BqYGyz?p=preview

Answer 1

"Most Engaged"订单的订单字段应该是函数本身，而不是函数名。如果您传递一个字符串，angular 将尝试按您的对象的字段 totalEngagement 排序，而它们没有这样的字段。

所以，简而言之，你需要的是

$scope.totalEngagement = function (content) {
    total = 0;
    if (content.likes_count)
        total -= content.likes_count;
    if (content.comments_count)
        total -= content.comments_count;
    return total;
};

$scope.orders = [
    {name: "Newest", order: '-created_at'},
    {name: "Oldest", order: 'created_at'},
    {name: "Most Engaged", order: $scope.totalEngagement}
];

或者，由于函数不需要在范围内，

$scope.orders = [
    {name: "Newest", order: '-created_at'},
    {name: "Oldest", order: 'created_at'},
    {name: "Most Engaged", order: totalEngagement}
];

function totalEngagement(content) {
    total = 0;
    if (content.likes_count)
        total -= content.likes_count;
    if (content.comments_count)
        total -= content.comments_count;
    return total;
}

对 ng-repeat 进行函数调用的动态 orderBy angularjs

Dynamic orderBy with function call on ng-repeat angularjs

angularjs

angularjs-ng-repeat

angularjs-orderby