2017-03-23 2 views
2

내 localhsost에 Json 형식으로 내 데이터베이스의 정보를 표시하려면 Rest를 사용하고 있습니다. URL은 http://localhost:8080/restful-services/api/getAllHorses입니다.각도 http get REST

나는 각도가 생겼고 내가하고 싶은 것은 http를 사용하여 json 정보에 액세스하는 것입니다.

이 내가 각도로 해봤지만 아무것도 표시되지 않는 것입니다 내 JSON

[{"horse":{"age":"6yo","breeder":"David Harvey","countryBred":"(IRE)","horseAge":"6yo","horseId":1,"horseName":"Brain Power","owner":"Michael Buckley","pedigree":"Kalanisi","sex":"(08May11 b g)","trainer":{"days":9,"location":"Lambourn","seaonWinners":119,"seasonStrikeRate":27,"stake":-69.77,"trainerId":2,"trainerName":"Nicky Henderson"},"trainerName":"Nicky Henderson"}}, 

입니다. 어떤 도움이라도 대단히 감사합니다. 에서

var horseApp = angular.module('horseApp', []); 
    horseApp.controller('HorseCtrl', function ($scope, $http){ 
    $http.get('http://localhost:8080/restful-services/api/getAllHorses').success(function(data) { 
     $scope.horse = data; 
    }); 
    }); 


<body ng-controller="HorseCtrl"> 
<h2>Horses</h2> 
<table> 
    <tr> 
    <th>Age</th> 
    <th>Name</th> 
    <th>Breeder</th> 
    </tr> 
    <tr ng-repeat="age in Horse.age "> 
    <td>{{horse.age}}</td> 
    <td>{{horse.horesName}}</td> 
    <td>{{horse.breeder}}</td> 
    </tr> 
</table> 

답변

2
  • $http.success가 사용되지 않습니다 success처럼 NG가-반복를 사용대신. $http
  • 배열을 반복 할 수 있도록 ng-repeat를 수정하면 horse이 배열이므로 유효하지 않은 속성 기간을 가리키고 있습니다. horse의 더 좋은 이름은 horses입니다.

수정 된 코드

horseApp.controller('HorseCtrl', function ($scope, $http){ 
    $http.get('http://localhost:8080/restful-services/api/getAllHorses') 
     .then(function(response) { 
     $scope.horse = response.data; 
    }); 
    }); 

HTML을

<tr ng-repeat="item in horse"> 
    <td>{{item.age}}</td> 
    <td>{{item.horesName}}</td> 
    <td>{{item.breeder}}</td> 
</tr> 
+1

그 덕분에, 고마워. – LoseYou21

0

변경 변수

<tr ng-repeat="h in horses"> 
    <td>{{h.horse.age}}</td> 
    <td>{{h.horse.horesName}}</td> 
    <td>{{h.horse.breeder}}</td> 
</tr> 

아래 사용 then 대신

$http.get('http://localhost:8080/restful-services/api/getAllHorses') 
    .then(function(response) { 
     $scope.horses = data; 
    }); 
+2

변경 $ scope.horses = response.data; – websch01ar