Ng-repeat not working in Ionic V1


#1

I’m trying to display the data from my json file using ng-repeat but it’s not working.

Below is my template code:

          <div ng-hide="hidden" data-ng-repeat="person in persons">
            <div class="item item-thumbnail-left">                           
            <img src="img/ionic.png">
            <div style="float: left;">
            <h2 class="listCss">{{person.name}}</h2>
            <h3>{{person.company}}</h3>
            <p>{{persons.id}}</p> 
             
            </div>
            <div style="float: right;padding-top: 20px;padding-right: 20px;">
            <i class="icon ion-close-circled addConnection" style="font-size:40px;padding-right: 10px;" ng-click="hidden=!hidden"></i>
            <i class="icon ion-person-add addConnection" style="font-size: 40px;" ng-click="addFriend()"></i>
            </div>
            <hr style="clear: both;top: 26px;position: relative;">              
          </div>             
         
          </div>

This is my js code

.controller(‘addFriendTabController’,function($scope,personService){
console.log(“addFriend tab”);
$scope.persons={};
$scope.persons=personService.getData();

$scope.addFriend=function(){
  window.alert("Request Sent");
}

})
.factory(‘personService’,function($http){
var StudentDataOp = {};
StudentDataOp.getData=function(){
return $http.get(“js/data.json”).
then(function(response){ console.log(response.data); return response.data;})
};

    return StudentDataOp;

})

And below is my json file content

[
{
“id”:1,
“name”:“John”,
“company”:“Infosys”
},
{
“id”:2,
“name”:“John2”,
“company”:“Infosys2”
},
{
“id”:3,
“name”:“John3”,
“company”:“Infosys3”
},
{
“id”:4,
“name”:“John4”,
“company”:“Infosys4”
},
{
“id”:5,
“name”:“John5”,
“company”:“Infosys5”
},
{
“id”:6,
“name”:“John6”,
“company”:“Infosys6”
},
{
“id”:7,
“name”:“John7”,
“company”:“Infosys7”
},
{
“id”:8,
“name”:“John8”,
“company”:“Infosys8”
}

]