1

我正在为 CRUD 产品制作一个简单的 CRUD 应用程序。产品具有 ID、名称和价格。我已经构建了一个 ASP.NET Web API 来存储这些产品,并且我试图在 AngularJS SPA 中调用这个 API。我已经构建了一个模块和相应的组件来从 API 中获取所有产品并在视图中呈现它们(listProducts)。

我不确定应该如何将 API 地址放入 $http.get() 方法中。我的 API 地址是:localhost:58875/api/products。我的代码:

列表产品.module.js

angular.module('listProducts', []);

列表产品.component.js

angular.
module('listProducts').
component('listProducts', {
    templateUrl: 'app/products/list-products/list-products.html',
    controller: ['$http',
        function listProductsController($http) {
            var self = this;

            $http.get('http://localhost:58875/api/products').then(function(response) {
                self.products = response.data;
            });
        }
    ]
});

在我看来,我也遇到了麻烦,因为 Angular 告诉我它无法识别我的控制器,我不知道为什么。

列表产品.html

<div class="container" ng-controller="listProductsController">
    <h2>Products</h2>
    <hr>    
    <div ng-repeat="p in products">
        <li>{{p.ID}}</li>
        <li>{{p.Name}}</li>
        <li>{{p.Price}}</li>
    </div>     
</div>
4

0 回答 0