其余的Api返回数据,但它没有显示在页面上

时间:2017-04-09 13:01:04

标签: javascript asp.net angularjs asp.net-mvc asp.net-web-api

我正在尝试从我制作的其余api中获取数据。 api返回数据,但角度无法加载它。我可以在开发人员工具中看到从网络选项卡传递的数据。

HTML code:

interface

Service.js

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <link href="Content/bootstrap.css" rel="stylesheet" />
    <script src="Scripts/angular.js"></script>
    <script src="Scripts/angular-resource.js"></script>
</head>
<body ng-app="productsApp">
    <div ng-controller="productsController">

            <table>
                <tr ng-repeat="p in products">
                    <td>{{p.productName}}</td>
                    <td>{{p.productCode}}</td>
                    <td>{{p.releaseDate | date}}</td>
                    <td>{{p.price | currency}}</td>
                </tr>
            </table>
    </div>
    <script src="Scripts/App.js"></script>
    <script src="Scripts/http.js"></script>
    <script src="Scripts/service.js"></script>
</body>
</html>

App.js

(function () {
    angular.module("productService", ["ngResource"]).
    factory("product", function ($resource) {
        return $resource('http://localhost:55755/api/products/:id');
    });
}());

1 个答案:

答案 0 :(得分:1)

虽然query()会返回一个承诺,但您可以这样做。只需注入一个自动在承诺部分执行的回调函数。

product.query(function (products) {
   $scope.products = products;
});

&GT;&GT; fiddle demo