Angular JS $ scope変数の値は$ httpから割り当てます

Question

私は角度jを初めて使用しています。ここに私はコードを持っています：私は番号のような応答データを受け取ります。このコードでは、どのように応答データを$ scope.vote_countingとして割り当てるのですか。このコードでは何も返されません。

$scope.votes = function(){ 
     var votes = $http({ 
       method: "post", 
       url: "/getVotes", 
       data: { id: $scope.Id} 
      }).success(function(response){ 
      }); 
      return votes; 
    } 

誰にも助けてください。

Answer 1

$httpと呼んでください。あなたはPOSTメソッドが、GETメソッドを使用している（getVotes）あなたのケースで、より適切なようだ：それはソートバージョンは

$http.post("/getVotes", { id: $scope.Id }).then(function(response) { 
    //handle success 
    $scope.votes_counting = response.data; 
}, function(error) { 
    //handle error 
}) 

注意される機能に

$http({ 
    method: "post", 
    url: "/getVotes", 
    data: { id: $scope.Id } 
}).then(function(response) { 
    //handle success 
    $scope.votes_counting = response.data; 
}, function(error){ 
    //handle error 
}); 

である必要はありません。

Answer 2

$ http関数は、サーバーの応答を返しません。しかし、すでに理解しているように、成功関数を使用してサーバーの応答を得ることができます。最も簡単にはおそらく$http.postを使用している

$http({ 
    method: "post", 
    url: "/getVotes", 
    data: { id: $scope.Id} 
}).success(function(response){ 
    $scope.votes = response 
}); 

Answer 3

：単にこのような成功関数の$scope.votes値を設定します。 successがthenの非推奨されていることに注意してください：

$scope.retrieveVotes = function(){ 
    $http.post('/getVotes', {id : $scope.id}).then(function(response){ 
    $scope.votes = response.data; 
    }); 
} 

も$http呼び出しがそうretrieveVotesも非同期で呼び出す非同期であることに注意してください。

Answer 4

約束事の基本的な取り扱いを示すスニペットを追加しました。ここでは、httpコールをモックするサービスを使用しました。応答はスコープ変数に添付され、ビューに表示されます。

angular.module('TestApp', []) 
 
    .factory('MockHttp', function($q) { 
 
    return { 
 
     getMockData: function() { 
 
     return $q.when(['A', 'B', 'C']); 
 
     } 
 
    }; 
 
    }) 
 
    .controller('TestController', function($scope, MockHttp) { 
 
    $scope.res = null; 
 

 
    MockHttp.getMockData() 
 
     .then(function(res)  { 
 
     $scope.res = res; 
 
     }) 
 
     .catch(function(err) { 
 
     console.log(err); 
 
     }); 
 

 
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="TestApp"> 
 
    <div ng-controller="TestController"> 
 
    {{res}} 
 
    </div> 
 
</div>