问如何在AngularJS中为推送到DOM中的新对象添加动画？

EN

<div>
  <h3>Add a quote:</h3>
  <input type="text" ng-model="newQuote.text" placeholder="Quote...">
  <input type="text" ng-model="newQuote.author" placeholder="Author...">
  <button ng-click="addQuote()">Add</button>
</div>

<h1>Quotes</h1>
<div ng-repeat="thisData in someData | filter:searchThis">
  <div id="{{thisData.id}}" class="quotes">
    <p class="quote">"{{thisData.text}}"<br>-{{thisData.author}}</p>
    <button class="deleteButton" ng-class="{on:state}" ng-click="deleteQuote(thisData.text)">X</button>
  </div>
</div>

$scope.getData = function(){
    $scope.someData = dataService.getData()
}

$scope.getData()

$scope.newQuote = {}
$scope.addQuote = function(){
    dataService.addData($scope.newQuote)
    $scope.newQuote = ""
}

var quotes = [
    { id: 0, text: 'Life isn\'t about getting and having, it\'s about giving and being.', author: 'Kevin Kruse'},
    { id: 1, text: 'Whatever the mind of man can conceive and believe, it can achieve', author: 'Napoleon Hill'},
    { id: 2, text: 'Strive not to be a success, but rather to be of value.', author: 'Albert Einstein'},
    { id: 3, text: 'Two roads diverged in a wood, and I took the one less traveled by, And that has made all the difference.', author: 'Robert Frost'},
    { id: 4, text: 'The most difficult thing is the decision to act, the rest is merely tenacity.', author: 'Amelia Earhart'},
    { id: 5, text: 'Life is what happens to you while you\'re busy making other plans.', author: 'John Lennon'},
    { id: 6, text: 'What even is a jQuery?', author: 'Tyler S. McGinnis'}
  ];

  this.getData = function(){
    return quotes
  }
  this.addData = function(someObj){
    if (someObj.text && someObj.author){
        quotes.unshift(someObj)
    } else {
        return "Error"
    }
  }