2016-02-25 15 views
16

Yeni TypeScript async/await özelliği ES6 sözlerini kullanıyor. AngularJS, biraz farklı bir arayüzle $q hizmet vaatlerini kullanır.

$q hizmet vaatleriyle TypeScript async/await özelliğini kullanmanın bir yolu var mı?

+1

Evet. İlk problem, ng-servisinden gelen her bir cevabını, onu beklemek için kullanmam gerekmesi. İkinci sorun, ifade beklemeden üretilen ES6 vaatlerinin – Random

cevap

16

nasıl yapıldığını ise: İşte bir kullanım örneği

angular.module('your app') 
     .run(['$window', '$q', function($window, $q) { 
      $window.Promise = $q; 
     }]); 
+0

Teşekkür ederim, sürümümden çok daha temiz. Ben, $ q hizmetinin, es6-promises – Random

+1

ile uyumlu bir kurucu olarak kullanılabileceğini bilmiyordum. Bu, şu anda birkaç projede kullanıyorum. Ama yardım edemem ama bu yaramaz hissi salla. Global Promise nesnesini Angular $ q servisiyle değiştirmek ... hackish gibi görünüyor. –

+2

Yerel Sözü $ q ile değiştirmek, muhtemelen uygulamanın yapılabileceği en kötü şeydir. Onlar farklı davranan temelde farklı uygulamalardır, bu 'Promise'e bağlı olan tüm üçüncü taraf kodlarını mahveder. 'Hackish' $ penceresi hakkında yapılan açıklama yanlıştır - çünkü angular açısal pencereyi kullanamadığından değil, çünkü DI iyidir. – estus

3

Doğrudan bunları kullanabileceğinizi düşünmüyorum. Ama böyle bir ++ vaadi içine bir şey q sözünü dönüştürmek oldukça kolay olmalıdır: her dosya nerede __awaiter fonksiyonunu oluşturur typescript 1.8 için

declare var __awaiter: Function; 
(window as any).__awaiter = __awaiter; // set global __awaiter to avoid declaring default __awaiter in other files 
async() => { } // dummy async function to generate __awaiter code for current file 

angular.module('ts-awaiter', []).run(['$timeout', ($timeout: ng.ITimeoutService) => { 
    function wrap(func: Function) { 
     return function() { 
      func.apply(this, arguments); 
      $timeout(() => { }); // run angular digest 
     }; 
    } 

    var oldAwaiter = __awaiter; 
    (window as any).__awaiter = (thisArg: any, _arguments: any, P: Function, generator: any) => { 
     P = function (executor: Function) { 
      return new Promise<any>((resolve, reject) => { 
       resolve = wrap(resolve); 
       reject = wrap(reject); 
       executor(resolve, reject); 
      }); 
     }; 
     return oldAwaiter(thisArg, _arguments, P, generator); 
    }; 
}]); 

Comliper:

function Convert<T>(qPromise): Promise<T> 
{ 
    return new Promise<T>((resolve, reject) => 
    { 
     qPromise.then((result: T) => resolve(result), (e) => reject(e)); 
    }); 
}; 
+4

açısal özet döngüsünü başlatmamasıdır. Sorun şu ki, $ q vaatlerini veren her ng hizmetini sarmak zorundayım. Ayrıca, ES6 vaatleri açısal özdev döngüsü başlatmaz. Yani, bu durumda, her bekledikten sonra '$ apply '' 'beklemek zorundayım' – Random

1

Sonunda aşağıdaki geçici çözümü kullanılan await operatörü kullanılır. Her bir resolve ve reject çağrısından sonra sindirim döngüsünü başlatan özel Promise yapıcısını geçen uygulama ile değiştiriyorum. https://github.com/llRandom/ts-awaiter İşte

+0

Sadece meraktan çıkma bu davranış nasıl reddediyor? blok yakalamak? – Luis

+0

Evet. Depoya bir örnek eklenmiştir – Random

+0

Bu, gereksiz sınamalara neden olabilir ve sindirimler AngularJS uygulama performansı için en sık karşılaşılan darboğazdır. Çözüm, TypeScript ES2017 hedefine uygulanamaz ... native async/wade zaten var. – estus