使用AngularJS查询Web API

问题描述 投票:1回答:2

我一直在关注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.successI looked up这种新方法。

如果我在调试时转到(localhost)/ api / musics,它会返回包含数据的XML文件。

有人可以帮忙吗?

谢谢

angularjs html5 asp.net-web-api
2个回答
© www.soinside.com 2019 - 2024. All rights reserved.