1

角度ワインアプリで問題が発生しました。問題は、私がすべてを1つのコントローラで動作させてしまったことです。今はそれらを分割したいと思いますが、データは表示されません。したがって、私はいくつかの助けを求めています。サービスでワインを表示していません

データが表示されていないことを除いて、私はすべて自分のオブジェクトを取得し、すべてがうまく見えます。誰でも助けることができますか?

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があなたのwinedataから)

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 = []; 
}); 
+0

ルーティングが正常に機能していると言わなければなりません。ちょうど表示されていないデータだけです –

答えて

1

機能getWine(からデータを取得することになっているファイルサービスサービスは何も返されないようです。

return response.Products.Lists; 

wines = response.Products.Lists; 

を交換しようとすると、あなたは問題ないはずです。

+0

これを行うようにしました。今のようになりました: –

+0

WineApp.service( 'winedata'、function($ http) { this.getWines =関数(){ $ http.get( "http://services.wine.com/api/beta2/service.svc/json/catalog?apikey=2aef2f70e044ebcb683f46df93ac4eb9&size=100") .success (関数(応答){// アラート(応答); にconsole.log(response.Products.List); // successcb(応答); 戻りresponse.Products.List; }) } –

+0

とまだ仕事がない(同じポストではないことを謝っています:) –

関連する問題