[英]$http.get method in angularjs for rest Api
我想使用angularjs中的$ http.get方法將REST-API的朋友列表提取到表中。 請參閱演示 。 當我單擊按鈕時,我無法加載JSON數據。
JSON.data
{
"friends": [
{
"FirstName": "John",
"LastName": "Doe"
},
{
"FirstName": "Ann",
"LastName": "Wellington"
},
{
"FirstName": "Sabrina",
"LastName": "Burke"
}
]
}
Index.html
<body ng-app="step4App">
<div ng-controller="FriendsCtrl">
<button ng-click="loadFriends()">Load Friends</button>
<table>
<thead>
<tr><th>First</th><th>Last</th></tr>
</thead>
<tbody>
<tr ng-repeat="friend in friends">
<td>{{friend.FirstName}}</td>
<td>{{friend.LastName}}</td>
</tr>
</tbody>
</table>
</div>
<script>
var app=angular.module("step4App",[]);
app.controller("FriendsCtrl", function($scope, $http){
$scope.loadFriends=function(){
$http.get("friendsList.json").success(function(data){
$scope.friends=data;
}).error(function(){
alert("An unexpected error occured!");
});
}
});
</script>
</body>
您的JSON文件有一個對象,而$scope.friends
是一個數組。
您需要更改此:
$scope.friends=data;
至:
$scope.friends = data.friends;
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.