没有用服务展示我的葡萄酒

Question

我的 Angular Wine 应用程序遇到了问题。问题是我已经在一个控制器中完成了所有工作，现在我想将它们拆分并且我已经这样做了，但是我的数据不会显示。因此，我正在寻求帮助。

我得到了我应该得到的所有对象，一切似乎都很好，除了数据没有显示。有人可以帮忙吗？

HTML：

<table class="table table-striped">
    <thead>
    <tr>
        <th>Name</th>
        <th>Description</th>
        <th>Year</th>
        <th>Price</th>
        <th>&nbsp;</th>
    </tr>
    </thead>



<tbody>
    <tr ng-repeat="wine in wines">
        <td><img ng-src="{{wine.Vineyard.ImageUrl}}" style="width: 100px; margin: 5px;" />{{wine.Name}}</td>
        <td style="width: 250px;">{{wine.Description}}</td>
        <td>{{wine.Vintage}}</td>
        <td>{{wine.PriceRetail | currency}}</td>
        <td>
            <button ng-click="selectWine(wine)" class="btn btn-warning"><span class="glyphicon glyphicon-pencil"></span></button>
            <button ng-click="removeWine(wine)" class="btn btn-danger"><span class="glyphicon glyphicon-remove"></span></button>
            <button ng-click="favWine(wine)" class="btn btn-info"><span class="glyphicon glyphicon-star"></span></button>
            <button ng-click="detailWine(wine)" class="btn btn-default"><span class="glyphicon glyphicon-zoom-in"></span></button>
        </td>
    </tr>
</tbody>

还有 AngularJS 文件

WineApp.controller("ListController", function($scope, $http, winedata) {
$scope.wines = winedata.getWines();

$scope.removeWine = function(wine) {
    // console.log("remove wine");

    var index = $scope.wines.indexOf(wine);
    // console.log(index);

    $scope.wines.splice(index, 1)
}

$scope.selectWine = function(wine) {
    $scope.wine = wine;
}

$scope.updateWine = function(wine) {
    // var editWine = {
    //   Name: $scope.wine.Name,
    //   Description: $scope.wine.Description,
    //   Vintage: $scope.wine.Vintage,
    //   PriceRetail: $scope.wine.PriceRetail
    // }
    $scope.wine = wine;
    // console.log(wine);
    // $scope.wines.extend(editWine);
    alert("Updated!");
    // $scope.wine.Name = "";
    // $scope.wine.Description = "";
    // $scope.wine.Vintage = "";
    // $scope.wine.PriceRetail = "";
}
});

它应该从中获取数据的服务

WineApp.service('winedata', function($http) {

this.getWines = function() {
$http.get("http://services.wine.com/api/beta2/service.svc/json/catalog?apikey=2aef2f70e044ebcb683f46df93ac4eb9&size=100")
.success(function(response) {
  //  alert(response);
  console.log(response.Products.List);

  wines = response.Products.List;
})
}


this.searchForWine = function(Name) {
        $http.get("http://services.wine.com/api/beta2/service.svc/json/catalog?apikey=2aef2f70e044ebcb683f46df93ac4eb9&size=100&search=" + Name)
        .success(function(response) {
            //  alert(response);
            console.log(response.Products.List);

            wines = response.Products.List;
        })
}
//  wines.favoriteWine = [];
});

Answer 1

您的 winedata 服务中的函数 getWine() 似乎没有返回任何内容。尝试替换

wines = response.Products.Lists;

与

return response.Products.Lists;

你应该没事的。