我试图使用前端 HTML 和 AngularJS 开发一个网站。我还有一个在线托管的 WebApi。我试图使用 angularjs 控制器 http get 方法从 JSON 格式的 WebApi 获取数据并使用 ng-repeat 指令显示它,但我没有获取数据,从 WebApi 获取数据存在一些问题。WebApi 是使用 asp.net c# WebApi 创建的。网站代码在这里(它是一个博客网站)-
blogController.js :
app.controller('blogController', ['$scope','$http', function ($scope, $http) {
$http.get('http://www.example.com/api/blog')
.then(function(res){
$scope.blog = res.data;
});
}]);
HTML 代码在下面 -
博客.html
<html>
<head></head>
<body app="myApp" ng-controller="blogController">
<div ng-repeat="blg in blog">
<h2>{{blg.BLOG_TITLE}}</h2><br/><br/><hr/>
<p>{{blg.BLOG_DESC}}</p><br/>
<p>{{blg.BLOG_AUTHOR}}</p>
</div>
</body>
</html>
Json WebApi 看起来像这样 -
[
{
"ID": 1.0,
"BLOG_DATE": "2020-05-02T00:00:00",
"BLOG_AUTHOR": 1.0,
"IMG_URL": null,
"BLOG_TITLE": "Test Blog",
"SHORT_DESC": "Blog 1",
"BLOG_DESC": "Blog1 Desc",
"NOTE": null,
"BLOG_TAG": "Uncategorized"
},
{
"ID": 2.0,
"BLOG_DATE": "2020-05-02T00:00:00",
"BLOG_AUTHOR": 1.0,
"IMG_URL": null,
"BLOG_TITLE": "Test Blog",
"SHORT_DESC": "Blog 1",
"BLOG_DESC": "Blog1 Desc",
"NOTE": null,
"BLOG_TAG": "Uncategorized"
},
{
"ID": 3.0,
"BLOG_DATE": "2020-05-02T00:00:00",
"BLOG_AUTHOR": 1.0,
"IMG_URL": null,
"BLOG_TITLE": "Test Blog",
"SHORT_DESC": "Blog 1",
"BLOG_DESC": "Blog1 Desc",
"NOTE": null,
"BLOG_TAG": "Uncategorized"
},
{
"ID": 4.0,
"BLOG_DATE": "2020-05-02T00:00:00",
"BLOG_AUTHOR": 1.0,
"IMG_URL": null,
"BLOG_TITLE": "Test Blog",
"SHORT_DESC": "Blog 1",
"BLOG_DESC": "Blog1 Desc",
"NOTE": null,
"BLOG_TAG": "Uncategorized"
}
]
问题仅发生在上述控制器中的 url 上。我尝试使用另一个 url,一个来自 myjson.com 的 url,它起作用了。但是“ http://www.example.com/api/blog ”不起作用。
请帮我解决这个问题。
添加一个.catch
块以显示错误:
app.controller('blogController', ['$scope','$http', function ($scope, $http) {
$http.get('http://www.example.com/api/blog')
.then(function(res){
$scope.blog = res.data;
}).catch(function(response) {
console.log("ERROR:", response);
});
}]);
然后在开发者控制台的网络选项卡中检查响应。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句