我对从webapi到angularjs和HTML的get方法有问题



我试图使用前端HTML和AngularJS开发一个网站。我还有一个在线托管的WebApi。我试图使用 angularjs 控制器 http get 方法从 JSON 格式的 WebApi 获取数据并使用 ng-repeat 指令显示它,但我没有获取数据,从 WebAPI 获取数据时存在一些问题。WebApi 是使用 asp.net c# WebAPI 创建的。代码网站在这里(它是一个博客网站( -

博客控制器.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 出现问题。我尝试使用另一个网址,来自 myjson.com 的网址,它奏效了。但是"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);
});
}]);

然后在开发者控制台的网络选项卡中查看响应。

最新更新