title: Animation within ng-repeat - not working
body: <p>I'm using angularJS (1.3.0-rc.4) and I'm trying to implement a fade-out animation within ng-repeat elements (or at this point any animation when an item is being added).</p>
  
  <p><strong>template file:</strong></p>
  
  <pre><code>&lt;div ng-repeat="message in messages"
      class="msg-popup alert alert-{{ message.type }}"&gt;
      &lt;span class="glyphicon glyphicon-info-sign"&gt;&lt;/span&gt;
      &lt;span class="msg-content"&gt;{{ message.content }}&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>scss file:</strong></p>
  
  <pre><code>.msg-popup {
      &amp;.ng-enter {
          -webkit-transition:0.5s linear all;
          -moz-transition:0.5s linear all;
          -o-transition:0.5s linear all;
          transition:0.5s linear all;
          opacity:0;
      }
  }
  </code></pre>
  
  <p>I guess at this point when any new element is being added to the list it should fade out in 0.5s? But it doesn't. </p>
  
  <p>If helpfull - that is how the list is being loaded - messenger is a service that holds the data and getMessages(5) retrieves 5 latest messages:</p>
  
  <p><strong>module controller:</strong></p>
  
  <pre><code>$scope.$on('messenger::updated', function(event, message) {
      $scope.messages = messenger.getMessages(5);
  });
  </code></pre>
  
  <p><strong>EDIT:</strong>
  One more question related with it, should I attach to bower "nganimate" as well ?</p>