我如何突出NG-重複項目

Question

如何彰顯最新的產品加入到顯示與NG-重複一個列表？我在我的addItem()功能使用jQuery effect()嘗試，但沒有奏效。我也嘗試過使用angular-ui的高亮過濾器，但沒有成功。

//controller 
$scope.addItem = function() { 
    $scope.items.unshift($scope.item); 
}; 

//html 
<ul class="media-list"> 
    <li class="media" ng-repeat="item in items | highlight:item"> 

Answer 1

Angular has been supporting animations since version 1.1.4。

只需添加ng-animate你li S，與動畫名稱：

<li ng-animate="'highlight'" ng-repeat="item in items">{{ item }}</li> 

，並提供適當的動畫CSS爲動畫名稱：

li { 
    -webkit-transition: all 2s 1.5s ease-out; 
    -moz-transition: all 1.5s ease-out; 
    transition: all 1.5s ease-out; 
} 

.highlight-enter-setup { 
    background: yellow; 
} 
.highlight-enter-start { 
    background: white; 
} 

這裏的小提琴：http://jsfiddle.net/u4Tnw/

---

你是不是僅限於突出顯示。你可以做各種瘋狂的動畫。

下面是一個更瘋狂的例子：http://jsfiddle.net/u4Tnw/3/