AngularJS with C＃WCF画面上で更新する前にレコードを挿入するまで待つ

Question

私はAngularJSを初めて使用し、履歴テーブルを持つWebページを構築します。アクションが発生すると、$ http.postを使用してデータベースにエントリが作成されます。その後、データベースからデータを再度取得し、テーブルに表示して、記録されている履歴の新しいエントリを表示します。

私が抱えている問題は、投稿が最初に呼び出され、次にgetが呼び出されることですが、挿入が完了する前にgetが行われるということです。投稿が完了するまで履歴から新しいデータを取得するように通話を遅延または禁止するにはどうすればよいですか？

$http.post('http://MYSERVER/Service1.svc/insertImageHistory', {params: {JSON: parameters}}). 
    success(function(data, status, headers, config) { 
     // this callback will be called asynchronously 
     // when the response is available 
     console.log(data); 
    }). 
    error(function(data, status, headers, config) { 
     // called asynchronously if an error occurs 
     // or server returns response with an error status. 
     console.log(data); 
    }); 

    $http.get('http://MYSERVER/WcfService/Service1.svc/getImageHistory', {params: {DOC_ID: DOC_ID}}) 
     .success(function (response){ 
       $scope.InsImageHistory = response; 
       alert(JSON.stringify(response)); 
     }) 
     .error(function(data, status) { 
      console.error('Response error', status, data); 
     }); 

Answer 1

あなたは、エンドポイントにデータを投稿している方法について、もう少し情報（WCFのAPI）が参考になるが、私はあなたを仮定します：ここで

は、私が作っています$のHTTP呼び出しです$ httpを利用しています。角度で

基本的なHTTPリクエストは次のようになります。あなたは上記の例で見ることができるように

// Simple GET request example: 
$http({ 
    method: 'GET', 
    url: '/someUrl' 
}).then(function (response) { 
    // this callback will be called asynchronously 
    // when the response is available 
}, function (response) { 
    // called asynchronously if an error occurs 
    // or server returns response with an error status. 
}); 

、$ HTTPサービスは約束を内蔵しています。 WCFサービスリクエストから応答を受け取ると、関数の '.then'部分にヒットします。これにより、Get/Postリクエストからの応答を受け取った後にコードを実行することができます。

リクエストの '.then'部分にコードを含めることができます。この方法で、 'Insert' APIメソッドから返信を受け取ると、挿入が完了したことを確認できます。その後、 'refresh' GET APIリクエストを呼び出すことができます。 $ HTTPの

ドキュメントはここで見つけることができます - 角度$ Qの約束のための$http Service マニュアルは、ここで見つけることができます - Promises $q

EDIT：オーケー、今私はさらに助言することができ、いくつかのより多くの情報を持っていること。

私があなただったら、あなたの機能（オブジェクト指向設計）を包むサービス/ファクトリを作成します。 「ImageService」と呼ぶことができます。追加、取得、削除などの関数を作成する$ httpメソッドをラップします。

私は私が話しているかを見るためにここにあなたのために本当に迅速かつ簡単Plunkerを作成しました：このサイト上の人からの助けにAngular Promises Plunker

Answer 2

おかげで、私はそれが今で働くようにする方法を考え出しました。私は私の最初の$ http.postため.then使用するように私のコードを変更し、.thenの内側に私はそうのような＃http.getと呼ば：

$http.post('http://MYSERVER/Service1.svc/insertImageHistory', {params: {JSON: parameters}}) 
    .then(function(data, status) { 
     $http.get('http://MYSERVER/WcfService/Service1.svc/getImageHistory', {params: {DOC_ID: DOC_ID}}) 
     .success(function (response){ 
       $scope.InsImageHistory = response; 
       //alert(JSON.stringify(response)); 
     }) 
     .error(function(data, status) { 
      console.error('Response error', status, data); 
     }); 
    }); 

・ホープこれは誰かに役立ちます。