AngularJS ng-repeat，突出顯示新元素

我有一個應用程序通過ajax輪詢服務器並將json添加到ng-repeat中。AngularJS 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>

來源

2015-05-28 logic-unit

可以應用基於$第一類？ –

你爲什麼不使用CSS選擇器ul li：last-child？比角度解決方案更輕 – bviale

是否可以向列表中的新項添加一個類，即那些未被軌道替換的類？因此，當從ajax輪詢更新列表時，只有新項目突出顯示。而不是隻強調列表中的最後一項。 –

您可以使用$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>

來源

2015-05-28 12:55:26 com2ghz

AngularJS ng-repeat，突出顯示新元素

回答

相關問題