javascript - AngularJS ng-repeat，突出显示新元素

Question

我有一个通过 ajax 轮询服务器并将 json 添加到 ng-repeat 的应用程序。

我想知道如何突出显示列表中的最新条目？

<div id="activity-listing" ng-controller="activityListing">
    <ul>
        <li ng-repeat="task in activity track by task.id | orderBy:'task.id':true" class="activity-item">
            <div class="activity-person">{{ task.name }}</div>
            <div class="activity-type">{{ task.activity }}</div>
            <div class="activity-time" am-time-ago="task.time"></div>
            <div class="activity-location">{{ task.location }}</div>
        </li>
    </ul>
</div>

Answer 1

您可以使用 $last 然后在其上应用 CSS 动画。 https://docs.angularjs.org/api/ng/directive/ngRepeat

ng-class="{lastItem: $last}"

<div id="activity-listing" ng-controller="activityListing">
    <ul>
        <li ng-repeat="task in activity track by task.id | orderBy:'task.id':true" class="activity-item" ng-class="{lastItem: $last}">
            <div class="activity-person">{{ task.name }}</div>
            <div class="activity-type">{{ task.activity }}</div>
            <div class="activity-time" am-time-ago="task.time"></div>
            <div class="activity-location">{{ task.location }}</div>
        </li>
    </ul>
</div>