AngularJS - 模型更改時動畫新元素

如何在模型更改時在ng-repeat中運行新元素的動畫？當模型發生變化時，新的元素會自動按角度創建，而在我看來，無法通知它（我沒有在文檔中發現任何事件）。當我的自定義指令的鏈接函數被執行時（它在新元素被創建時被執行，但在被添加到DOM之前被執行），因爲我期望在將新元素添加到DOM之後執行定時器函數，所以我現在解決了這個問題，這要歸功於setTimeout(O, runAnim) （所以它呈現），但我不確定這是否會在每個瀏覽器和每種情況下工作，因爲角內部。有沒有更好的方法來獲得這種行爲？AngularJS - 模型更改時動畫新元素

EDI1：當元素被刪除，當模型改變（如果我想淡出他們）

的index.html

<!DOCTYPE html> 
<html ng-app="MyApp"> 
<head> 
    <meta charset="utf-8" /> 
    <title>Angular js</title> 
    <script type="text/javascript" src="js/jquery-2.0.2.min.js"></script> 
    <script type="text/javascript" src="js/angular.min.js"></script> 
    <script type="text/javascript" src="js/app.js"></script> 
    <script type="text/javascript" src="js/Controllers.js"></script> 
</head> 
<body ng-controller="MyController"> 
     <ul> 
      <li ng-repeat="user in users" ng-bind="user" my-anim></li> 
     </ul> 
</body> 
</html>

Controllers.js

這是不行的

function MyController ($scope) { 
    $scope.users = ['foo', 'bar']; 
}

app.js

angular.module("MyApp", []) 

    .directive('myAnim', function() { 
     return function (scope, elem, attr) { 
      elem.hide(); 
      setTimeout(function() { 
       elem.fadeIn(); 
      }, 0); 
     } 
    });

來源

2013-06-24 Krab