Infinite Scroll and Firebase

Hi, I have in app.js’ controller thus:

    $scope.loadMoreData=function()
    {
      var sync = $firebase(postUrl).$asArray();
      $scope.posts = sync;
      $scope.$broadcast('scroll.infiniteScrollComplete');
    };

     $scope.$on('$stateChangeSuccess', function() {
    $scope.loadMoreData();
  });
$scope.posts = [];

and in my view:

            <ion-tab title="Home" icon-on="ion-ios7-home" icon-off="ion-ios7-home-outline">
                <div class="bar bar-subheader">
                    <h1 class="title positive"><i style="font-size:2em" class="ion-ios7-home"></i></h1>
                </div>
                <ion-content padding="true" has-bouncing="true">
                    <div class="list card" ng-repeat="t in posts">

                        <div class="item item-avatar">
                            <img src="avatar.jpg">
                            <h2>{{t.title}}</h2>
                            <p>{{t.artist}}</p>
                        </div>

                        <div class="item item-body">
                            <img src="cover.jpg">
                        </div>

                        <a class="item item-icon-left assertive" ng-click="download()" href="#">
                            <i class="icon ion-ios7-filing"></i>
      Download
                        </a>

                    </div>
                    <ion-infinite-scroll distance="1"
             on-infinite="loadMoreData()"
             icon="ion-refreshing"
             ></ion-infinite-scroll>
                </ion-content>
            </ion-tab>

No data is shown on the view. What did I not put right please?

Thanks