Loop through li - Fade In / Fade Out - repeat - Using Angularjs

I have just started using Angularjs.... I have created a simple polling script to pull data from a php script.

discussionApp.controller('ViewCtrl', function($scope, $timeout, $http /* , $location,  */) {
    console.log("View Controller");
    $scope.pageClass = 'page-view';


   
    $scope.contents = [];
    lastID = "0";


        var getData = function() {
            $http.post('getData.php?id='+lastID)
            .success(function(data, status) {
                //$scope.contents = data;

                if (data != undefined) {
                    Array.prototype.push.apply($scope.contents, data);

                    lastID = $scope.contents[$scope.contents.length - 1].discussionID;
                    console.log("LAST ID: "+lastID);
                }
            })
            .error(function (data, status) {
                console.log("ERROR: "+status)
                $scope.status = status;
            });

            $timeout(function() {
                $scope.value++;
                getData();
            }, 50000);

            //showNextImage();
        };

        //Start function getData()
        getData();


});

Select all Open in new window

Currently the data gets listed on the screen

      <div>
        <ul id="allImages">
          <li ng-repeat="content in contents" class="{{content.discussionID}} images">
            {{content.discussionID}} - {{content.discussionName}} - {{content.discussionText}}
          </li>
        </ul>
      </div>

Select all Open in new window

I would like to create a function that fades in one li ... waits 2 seconds ... then fades out.
Once it gets the end of the list, start again.