Javascript AngularJS在ng repeat中的新项上添加CSS类

这是我对列表的看法

<a href="#/">back...</a>
<ul>
    <input type="text" ng-model="search">

    <li ng-repeat="item in items | filter:search | orderBy:'date'">
        {{ item.ID }} - {{ item.heading }} - {{ item.date | date:"dd.MM.yy" }}
        <button ng-click="deleteItem(item.ID)">del</button>
    </li>

    <form>
        <input type="text" ng-model="itemName">
        <input type="date" min="{{ date }}" max="{{ maxDate }}" value="{{ date }}" ng-model="itemDate">
        <button ng-click="addItem()">add</button>
    </form>
</ul>

{{item.ID}-{{item.heading}-{{item.date | date:“dd.MM.yy”}
德尔

添加

---

单击“我的控件”可将一个新项目添加到视图中，效果良好。现在我只想用css3为新项目设置动画。因此，新项需要一个类。如何使用angular实现这一点？

这应该动态地将类

分配给列表的最后一个元素：

<li ng-class="{'the-class': $last}" ng-repeat="item in items | filter:search | orderBy:'date'">
    {{ item.ID }} - {{ item.heading }} - {{ item.date | date:"dd.MM.yy" }}
    <button ng-click="deleteItem(item.ID)">del</button>
</li>


{{item.ID}-{{item.heading}-{{item.date | date:“dd.MM.yy”}
德尔

如果使用函数添加项目，还可以设置一个变量，以便在将项目添加到列表时知道最后插入的Id

首先，你可以看到我在这里做了什么

我刚刚创建了一个
lastInsertedId
变量，用于在ng repeat中添加一个类：

<span ng-class='{lastinserted: item.ID==lastInsertedId}'>{{ item.ID }} - {{ item.heading }} - {{ item.date | date:"dd.MM.yy" }}</span>

我更改最后插入的id，它将所选类应用于项目

您还可以在
delItem（）
方法中取消设置
lastInsertedId
值

如果您有一个更难的逻辑（这里我假设您有唯一的ID），您还可以使用
ng类中的函数。在这里，以我的例子来说，它不会是：

然后



用一个简单的逻辑不会有太大的变化，但是你完全可以有一个基于ID、名称和日期的逻辑

玩得开心
如果您使用的是Angular 1.1.5，您可以使用ngAnimate enter事件，它正是为这种情况而设计的

看一看，如果它是数组中的最后一个成员，那么可以给它一个特殊的类吗？谢谢，我也会尝试一下！
$scope.addItem=function(){
        var dd=new Date($scope.itemDate);       
        $scope.items.push( {"ID":$scope.items.length+1, "heading":$scope.itemName, "date":dd.getTime()});
        $scope.lastInsertedId=$scope.items.length;
        }

$scope.amITheOne=function(item){
    return item.ID==$scope.lastInsertedId;
}

<span ng-class='{lastinserted: amITheOne(item)}'>