AngularJS $ httpはうまくいきませんか？

私はHTMLページのすべての製品をretriveしたいAngularJSと初心者だが、「/ allProdは」角度

app.js

var app=angular.module('crm',[]); 
app.controller('CRMController', function($scope,$http){ 
    $scope.products=[]; 
    $http.get('/allProd') 
    .then(function(data){ 
     $scope.products=data; 
    }); 
});

せずに完璧に動作した場合でも、それが何を示していませんindex.htmlを

<html data-ng-app="crm" > 
<head> 
    <meta charset="ISO-8859-1"> 
    <title>Catalog</title> 
    <link rel="stylesheet" type="text/css" href="bootstrap-3.3.4-dist/css/bootstrap.min.css"/>  
    <link rel="stylesheet" type="text/css" href="css/style.css"/> 
</head> 
<body data-ng-controller="CRMController"> 
    <table class="table"> 
    <thead> 
     <tr> 
     <th> REF </th><th> DES </th><th> PRICE </th> 
     </tr> 
    </thead> 
    <tbody > 
     <tr data-ng-repeat="p in products.content"> 
     <td>{{p.reference}}</td> 
     <td>{{p.designation}}</td> 
     <td>{{p.price}}</td> 
     </tr> 
    </tbody> 
    </table> 

<script type="text/javascript" src="angular/angular.min.js"></script> 
<script type="text/javascript" src="angular/angular-sanitize.min.js"></script> 
<script type="text/javascript" src="js/app.js"></script> 
</body> 
</html>

What i got

PS：角度1.5.6とスプリングブート1.5.2を使用しています。リリース

出典

2017-04-04 MyungHee

'data'変数がnullであるかどうか確認しましたか？ – Barak

あなたのhtml とあなたがデータを入手したものを簡単に見てください。 –

ありがとうございます！ – MyungHee

documentation for $httpによれば、実際のレスポンスボディはレスポンスのdataプロパティにあります。

$http.get('/allProd') 
.then(function(response){ 
    $scope.products = response.data; 
});

出典

2017-04-04 23:54:33

私はあなたの提案を試みましたが、変更はありません – MyungHee

あなたはあなたの中にも

$scope.products = response.data

を行う必要がありますあなたは、配列を言及する必要がNG-繰り返しますが、あなたの初期化と代入は$のために同期していないようだでscope.productsコントローラ。

response.data.productsが配列でない場合は、データが成功した場合に受信するのでそれはある配列

出典

2017-04-05 03:28:51

私はresponse.dataを試みましたが、変更はありません – MyungHee

は別のプロパティは、実際に必要な製品データを保持している、内部のデータを呼び出したとして、何のポイント$scope.productsを宣言がありません。あなたの.jsファイルに変更した後

var app=angular.module('crm',[]); 
app.controller('CRMController', function($scope,$http){ 
    $scope.products=[]; 
     $http.get('/allProd') 
     .then(function(data){ 
     $scope.products=data.data; 
    }); 
});

出典

2017-04-05 03:31:28

私はこれを前に試しましたが、変更はありません – MyungHee

にコードを変更

試し： $ scope.products = data.data。 "製品のp" あなたは.contentを必要としない

：

その後、"products.contentのp" 次へ からあなたの.htmlファイルを変更します。 .contentはデータ構造の一部ではないためです。

出典

2017-04-05 17:41:56 dowgwi

ああ...チャーリー・ンが私を打ち負かす。 – dowgwi

AngularJS $ httpはうまくいきませんか？

答えて

関連する問題