如何在Web API中使用angular ng-repeat? [英] How to use angular ng-repeat with an Web api?
问题描述
我正在尝试使用前端html建立网站并从Web-api获取其数据.我的Web-api返回json格式.所以我试图通过Angular $ http和ng-repeat指令使用Get请求.我的角度控制器就是这样-
I'm trying to build a website using front-end html and get its data from a Web-api. My Web-api returns a json format. So I was trying to use the Get request using Angular $http and ng-repeat directive. My angular controller is like this -
'use strict'; app.controller('blogsController', ['$scope','$http', function ($scope, $http) {
$http.get('www.example.com/api/blog')
.then(function(res){
$scope.blogs = res.data;
});
}]);
html代码如下所示-
The html code looks like this -
<body app="ng-app" >
<div ng-repeat="xr in blogs" >
<div id="blog_title" >
{{xr.blog_title}}
</div>
<div id="blog_text">
{{xr.blog_text}}
</div>
</div>
</body>
我已经尝试过了，但这并没有从博客Web API获得数据.
I have tried this but this is not getting me the data from the blog web api.
请帮助我获得解决方案.....
Please help me to get the solution.....
推荐答案
您的代码没有错
<div ng-repeat="xr in blogs" >
<div id="blog_title" >
{{xr.blog_title}}
</div>
<div id="blog_text">
{{xr.blog_text}}
</div>
</div>
，但请确保您的 res.data 必须遵循以下安排:
but make sure that your res.data must follow an arrangement like below:
res.data = [{'blog_title': 'title value1', 'blog_text':'text value'}
{'blog_title': 'title value2', 'blog_text':'text value'}
{'blog_title': 'title value3', 'blog_text':'text value'}]
使用 console.log 在Web控制台中打印 res.data 进行确认.
print your res.data in web console using console.log to confirm.
这篇关于如何在Web API中使用angular ng-repeat?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
