2015-06-24 14 views
5

Aşağıdaki sorundan ve olası nedenleri/çözümleri hakkında bazı fikirlere ihtiyacım var.UI güncelleştirmesiyle ilgili veriler gecikmeli - ng - yineleme (ngAnimate issue)

<td class="total"><i data-ng-click="removeProduct(product, $index)" class="icon-remove-circle"> </i></td> 

ve işlevi:

removeProduct: function (removedProduct, index) { 
    var _this = this; 
    _this.$scope.shoppingCart.splice(index, 1); 

    // + DELETE API Request 
}, 

The

Her hat üzerinde bir silme düğmesi ile

<tr data-ng-repeat="product in shoppingCart"> ... </tr> 

-tekrar ng bir yer verebileceği gövdeli bir tablo Sorun şu ki, API istek yanıtını beklemem ve modeldeki veriler hemen güncelleniyorsa (l shoppingCart nesnesinin içeriği ve içeriği), değişiklikler UI'de önemli bir gecikmeyle görünür ve olması gerektiği gibi değil.

DÜZENLEME: Sadece açısal-animate (ngAnimate) öğesini projeden kaldırarak sorunun çözüldüğünü öğrendim. Mesele şu ki projede açısal-canlandırma kullanıyorum ve onu kaldıramıyorum.

+0

Sonunda düzeltmeyi buradan kullandım https://gist.github.com/FGRibreau/9504619 – IceWhisper

cevap

0

Yaptığınız şey yanlış değilse, delete API'nizden gelen yanıtı kontrol etmeden shoppingCart listenizdeki bir öğeyi siliyor. Olasılıklar API’nin başarısız olmasına ve öğenin buna rağmen silinmesine olanak tanıyor. API yanıta benzer, belki bir şey esaslı silme gerçekleştirin - Eğer sepeti (sepetinden öğeyi silmek) güncelleme olabilir ya yanıtına bağlı olarak silme API yanıtı aldıktan sonra

removeProduct: function (removedProduct, index) { 
    var _this = this; 
    $http.post('DELETE API').then(function(success) { 
     _this.$scope.shoppingCart.splice(index, 1); 
    }, function(failure) { 
     console.log("Error in deleting", failure) 
    }); 
}, 

veya atmak hata.

İlgili konular