Promise łańcuchowe przy użyciu $ timeout

Question

Próbuję zrozumieć obietnicę API i łańcuchów, w szczególności czas, kiedy $timeout jest używany z .then(). To, czego się spodziewałem, to to, że ponieważ $timeout zwróci obietnicę, .then() nie zostanie wywołane, dopóki nie zostanie rozwiązane.

Ale zamiast ABAB, to ABBA cały czas.

Jak mogę skorzystać z interfejsu API obietnicy, aby zapewnić, że długo trwające połączenie (lub opóźnione połączenie za pomocą $timeout) zostanie faktycznie ukończone przed wykonaniem .then()?

Kod

angular 
    .module('app', []) 
    .controller('ThenCtrl', ThenCtrl); 

function ThenCtrl($timeout, $q) { 
    var vm = this; 

    vm.items = []; 

    $q.when(pushA()).then(pushB()); 

    $timeout(pushA, 5000).then(pushB()); 

    function pushA() { 
    vm.items.push('A'); 
    } 

    function pushB() { 
    vm.items.push('B'); 
    } 
} 

Markup

<div ng-app="app"> 
    <div ng-controller="ThenCtrl as vm"> 
    {{vm.items}} 
    </div> 
</div> 

mam założyć skrzypce: https://jsfiddle.net/kan3c61t/

Answer 1

Nie wywoływać funkcje wewnątrz metod .then.

$q.when(pushA()).then(pushB); 
    //$q.when(pushA()).then(pushB()); 

    $timeout(pushA, 5000).then(pushB); 
    //$timeout(pushA, 5000).then(pushB()); 

Zamiast tego przekazuj funkcje jako argumenty do metody .then. Usługa $q będzie przechowywać te funkcje, które będą później wywoływane.

Sposób działania usługi $q polega na przechowywaniu argumentu metody .then jako funkcji, która ma zostać później wywołana. W tym przypadku usługa $q przechowywała wartość zwróconą przez pushB() z efektem ubocznym polegającym na natychmiastowym przepychaniu na macierz wartości B.

DEMO on JSFiddle

Answer 2

Tutaj jesteś. To, co zrobiłem, to zasadniczo dodana funkcja success w części kodu zgodnej z then.

$timeout(pushA, 5000).then(function(success) { 
    pushB() 
    }); 

Oto działa demo.

Można również dodać error function jak ten

$timeout(pushA, 5000).then(function(success) { 
    pushB() 
    },function(error){console.log("Error");}); 

Podczas poszukiwania tej odpowiedzi, doszedłem również po drugiej stronie to bardzo helpful link

Answer 3

Jak wspominają inni - Twój większym problemem jest to, że .then(promise) i nie .then(function).

Obietnice oznaczają wartość + czas. Jest to wynik wyniku już rozpoczętej operacji. Obietnica to wartość - then czeka na funkcji. Nie można "realizować obietnic po innej obietnicy" - ponieważ obietnica oznacza, że ​​operacja już się rozpoczęła.

Po then(x) dla funkcji innych niż funkcja jest ignorowana.Jest to niefortunny wybór w specyfikacji obietnic, ale musimy z tym żyć.

Ponieważ Twoje połączenia są synchroniczne, nie powinieneś używać do tego obietnic. Jeśli kod robi coś synchroniczne można sekwencji działań z ; i nie then:

pushA(); 
pushB(); 

Jeśli jest to wezwanie, które zwraca obietnice to po prostu staje się:

pushA().then(pushB); 

Nie ma sensu w nazywaniu $q.when który zamienia nie obietnice na obietnice.

że piszę to jako:

pushA(); 
$timeout(5000).then(pushB); 

Nie ma sensu, aby przekształcić pierwszy synchroniczne działanie na funkcję powracającego obietnicy lub zaangażować obietnic nigdzie z wyjątkiem timeout. Jeśli potrzebujesz pushA wydarzy po 5000ms że sama wciąż chyba napisać:

$timeout(5000).then(pushA).then(pushB) 

Ponieważ myślę, że jest bardziej czytelny i znowu nie wiążą pushA i pushB obietnicami bezpośrednio.