Angular.JS İki eşzamansız servis çağrısını durdurun, ardından her ikisini de tamamladıktan sonra harekete geçin

Question

Hala Beynimi Angular.JS etrafına sarıyorum.

Uzak web hizmetlerinden veri alan iki bağımsız $ http çağrılarım var. Her iki servis çağrısının da tamamlanmasından sonra ateş etmek istediğim bir eylemim var.

1. ilk servis çağrısı, $ scope.model
2. ikinci servis çağrısı dolduracaktır $ scope.model verileri değiştirir

(o görünümde işlenen bazı sayaç özelliklerini ekler)

Diğer bir özel gereksinim ise, ikinci servis çağrısının en sonunda $ scope.model ile denetleyici dışında çağrılıp güncellenmesidir. Bir bildirim mesajı pompası.

Tahmin ederim ki $ q ve muhtemelen $ servis sözlerini kullanacağım, ama bazı en iyi uygulamaları izleyerek böyle bir şey için nereden başlayacağınıza emin değilim.

Eşzamanlı çağrılar burada uygun gibi gelmediğini biliyorum, çünkü örneğim eşzamanlı olarak yapılarak basitleştirilebilir. Ancak, ikinci servis çağrısı bir bildirim güncelleyicisidir, bu yüzden sunucuya sürekli olarak sorgulanır (en sonunda bir web kamerası kullanılır).

Bu uygulamada göreceğim ortak bir kalıptır.

Answer 1

Sen $ kullanmak isteyeceksiniz q sözler. Özellikle $ q.all(). Tüm $ http yöntemleri vaatlerini iade edecek. $q.all([promise, promise, promise]).then(doSomething) tüm vaatlerin çözülmesini bekleyecek ve söz verilen sonuçların bir dizisini ileterek doSomething numaralı telefonu arayacaktır.

app.service('myService', ['$http', '$q', function($http, $q) { 
    return { 
     waitForBoth: function() { 
      return $q.all([ 
      $http.get('/One/Thing'), 
      $http.get('/Other/Thing') 
      ]); 
     }; 
    } 
}]); 

Sonra diyoruz:

app.controller('MyCtrl', ['$scope', 'myService', function($scope, myService) { 
    myService.waitForBoth().then(function (returnValues){ 
     var from1 = returnValues[0].data; 
     var from2 = returnValues[1].data; 
     //do something here. 
    }); 
}]); 

İşte sana bir gösteri Plunker bu.

Answer 2

İlk servis çağrınız için bir hizmet oluşturun. Pete'in cevabı bu konuda yardımcı olacaktır: Kumandanızda olarak https://stackoverflow.com/a/12513509/215945

sonra() geri aramasında, uygun $ scope.model özelliği için bir $ saatini ekleyin:

app.controller('MainCtrl', function(myService, $scope) { 
    myService.async().then(function(myData) { 
    $scope.model = myData; 
    $scope.$watch('model.???', function(newVal, oldVal) { 
     if(newVal !== oldVal) { 
     // do something here, now that $scope.model.??? has changed 
     } 
    }) 
    }); 
});