AngularJS：如果 $index 发生变化，我如何为文本设置动画？答案

【问题标题】：AngularJS: How do I animate the text if $index changes?AngularJS：如果 $index 发生变化，我如何为文本设置动画？
【发布时间】：2018-09-03 10:19:51
【问题描述】：

我在 angularjs 中有一个应用程序，它在后台使用 $interval() 并每秒通过 PHP 从数据库中请求数据。

然后我使用 track by $index 这确实有助于提高性能。

<tr ng-repeat="user in users track by $index">
<td>{{user.name}}</td>
</tr>

但是当 <td> 的数据发生变化时，我想将文本颜色更改 1 秒。

【问题讨论】：

【解决方案1】：

也许你可以试试

<td ng-style="{color:#000}">{{user.name}}</td>

请记住，数据每秒都会重新加载。

或者您可以使用条件跟踪控制器更改了哪些数据，并根据条件设置变量 true 或 false

$scope.datachange = true;

那么在视图中你可以这样做

 <td ng-style="datachange && {color:#000}">{{user.name}}</td>

【讨论】：

【解决方案2】：

我会做什么，而不是查看索引的变化，而是在您希望颜色更改的地方放置一个 ng-class：

<tbody ng-class="{'changed-class': dataChanged}">

然后，在控制器中的数据发生更改后，将 $scope.dataChanged 的值更改为 true，然后在一秒钟后通过注入 $timeout 将其更改为 false：

$scope.dataChanged = true;
$timeout(function(){
    $scope.dataChanged = false;
}, 1000);

当然，在您的 CSS 中添加更改后的类，并在更改发生时使用您希望文本的颜色。

【讨论】：