Data not rendering

i have a scope variable to store an array from http request. on alert its showing objects inside it but not rendering the data in template … why so ?
my codes

 $scope.eventdesc = function(id)
        {
         
             $http({
                        method: 'POST',
                        url: ApiEndpoint.url+ 'eventdesc.php',
                        data:{'eventid':id},
                        headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
                      }).then(function successCallback(response){
                       $scope.eventData = response.data.events;
                       alert($scope.eventData[0].rule);
                        // $scope.groups = [];
                        //         for (var i=0; i<=$rootScope.myData.length; i++) {
                                  
                        //           $scope.groups[i] = {
                        //             name: i,
                        //             show: false
                        //           };
                        //         }      
                         $state.go('Side.eventdesc');
                       $ionicLoading.hide();
                       //$scope.showAlert($scope.myData);
                      },function errorCallback(response) {
                        $ionicLoading.hide();
                          console.log("ERROR");
              $scope.showAlert("<center>No Internet Connection</center>","ERROR");
              
                      });

        }

html

<ion-view hide-nav-bar="true">

<div style="background-color:#FE534B" class="bar bar-header bar-positive">
      <button class="button button-icon icon ion-navicon" style="text-align:left;padding-right:20px" menu-toggle = "left"></button> 


     <h1 class="title">Description</h1>
    </div>

 <ion-content>
 
<ol>
<li ng-repeat="y in eventData">{{y.rule}}</li>
</ol>

</ion-content>

</ion-view>