Javascript 动态重新排序/排序ng重复列表

我正在研究angularjs。我正在尝试重新排列ng重复列表。 有在线用户列表。
用户可以随时接收消息。每当用户收到消息时，我都会更新ui，并在名称下显示最近的消息。 我正在尝试根据收到最近消息的用户对用户列表进行排序。接收消息的用户应位于顶部

有些守则— 用户列表控制器：

$scope.$watch('service.get.userList()', function (values) {

    var result = [];
    angular.forEach(values, function (value) {


        processChatService.registerObserverCallback('lastMessage', function () { //i call this event when user receives the message
            $scope.$apply(function () {
                value.l = processChatService.get.lastMessage(value.u); //returns the recent message
                value.time = processChatService.get.lastMessageTime(value.u); //returns time
            });
        });
        value.l = processChatService.get.lastMessage(value.u); //it returns null if user havent recieve message
        value.time = processChatService.get.lastMessageTime(value.u);

        result.push(value);
    });
    $scope.users = result;
});

html：

<div ng-repeat="user in users  | filter:search"> <a class="list-group-item" ng-click="click(user)" ng-href="">
                        <div class="row">
                            <div class="col-xs-2">
                                <div class="thumb-userlist-sm pull-left mr">
                                    <img class="img-circle"  ng-src="{{ user.p }}" alt="...">
                                </div>
                            </div>
                            <div class="col-xs-8">
                                <div class="message-sender">{{ user.n }}</div>
                                <div class="message-preview">{{user.l}}</div>
                            </div>
                            <div class="col-xs-2">
                                <div class="pull-right">{{user.time}}</div>
                            </div>
                        </div>
                    </a>

    <div class="row">
        <div class="col-xs-2"></div>
        <div class="col-xs-10">
            <div class="line-separator"></div>
        </div>
    </div>
</div>

---

您可能要做的是命令

ng重复执行

：

<div ng-repeat="user in users  | filter:search | orderBy: 'time'">

这将在每个

用户

的

时间

属性上对

用户

进行排序。还可以使用

-time

反转排序顺序

---

有关orderBy筛选器的更多信息，请查看。

我们可以使用orderBy来完成此操作。现在这取决于需求。在您的情况下，是时候了

<div ng-repeat="user in users  | filter:search | orderby:'time'"> <a class="list-group-item" ng-click="click(user)" ng-href="">
                        <div class="row">
                            <div class="col-xs-2">
                                <div class="thumb-userlist-sm pull-left mr">
                                    <img class="img-circle"  ng-src="{{ user.p }}" alt="...">
                                </div>
                            </div>
                            <div class="col-xs-8">
                                <div class="message-sender">{{ user.n }}</div>
                                <div class="message-preview">{{user.l}}</div>
                            </div>
                            <div class="col-xs-2">
                                <div class="pull-right">{{user.time}}</div>
                            </div>
                        </div>
                    </a>

    <div class="row">
        <div class="col-xs-2"></div>
        <div class="col-xs-10">
            <div class="line-separator"></div>
        </div>
    </div>
</div>

您需要签出名为

orderBy

；）的内置过滤器然后ng repeat变为

ng repeat=“用户中的用户|过滤器：搜索| orderBy:'time'”

在大型列表上使用

orderBy

时要小心。更改后，每个摘要周期将执行两次筛选器，这可能会导致不可接受的性能开销