使用AngularJS查询Web API
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了使用AngularJS查询Web API相关的知识，希望对你有一定的参考价值。
我一直在关注this tutorial并拥有以下控制器：
(function (app) {
var MusicListController = function ($scope, $http) {
$http.get("/api/Musics").then(function (data) {
$scope.musics = data;
},function (response){}
);
};
app.controller("MusicListController", MusicListController);
}(angular.module("theMusic")));
模块：
(function () {
var app = angular.module('theMusic', []);
}());
和html：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Music App</title>
<script src="../../Scripts/angular.js"></script>
<script src="../../Scripts/jquery-1.10.2.js"></script>
<link href="../../Content/Site.css" rel="stylesheet" />
<link href="../../Content/bootstrap.css" rel="stylesheet"/>
<script src="../../Scripts/bootstrap.js"></script>
<script src="../Scripts/theMusic.js"></script>
<script src="../Scripts/MusicListController.js"></script>
</head>
<body>
<div ng-app="theMusic">
<div ng-controller="MusicListController">
<table class="table table-bordered">
<thead>
<tr>
<th>Title</th>
<th>Singers</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="music in musics">
<td>{{music.Title}}</td>
<td>{{music.Singers}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
</html>
它应该显示API请求的结果，但目前显示的所有内容都是空表。我怀疑我的问题出在我的$http.get.then函数的某个地方，因为教程使用了一个似乎被弃用的$http.get.success和I looked up这种新方法。
如果我在调试时转到（localhost）/ api / musics，它会返回包含数据的XML文件。
有人可以帮忙吗？
谢谢
以上是关于使用AngularJS查询Web API的主要内容，如果未能解决你的问题，请参考以下文章
如何从 AngularJS 站点安全地连接到 web api
使用 AngularJS 和 ASP.NET Web API 上传/下载字节数组
Rest API 生成 PDF byte[] JSON 内容类型，使用 angularJS 在 Web 中查看
ABP示例程序-使用AngularJs，ASP.NET MVC，Web API和EntityFramework创建N层的单页面Web应用