Wert von Promise.all nicht immer interpretiert von Angular

Question

Ich habe einen Controller wie so:

controller.things = ['a', 'b', 'c']; 
controller.loading = true; 
controller.responses = []; 

controller.handlePromises = function(){ 
    var promises = []; 

    for(promiseIndex = 0; promiseIndex < controller.things.length; promiseIndex++) { 
     promises.push(controller.promise(things[promiseIndex]); 
    } 

    Promise.all(promises).then(function success(response){ 
     for(responseIndex = 0; responseIndex < response.length; responseIndex++){ 
      responses.push(response[responseIndex].data); 
     } 
     controller.loading = false; 
    } 
} 

controller.promise = function(value){ 
    //Some $http request to Database; 
} 

controller.handlePromises(); 

Die Menge an Material in controller.things ist abhängig von den Benutzern. An dieser ist eine einfache HTML-Seite, macht folgende:

<div ng-if="!controller.loading"> 
    <div ng-repeat="response in controller.responses"> 
     {{response}} 
    </div> 
</div> 

Mein Problem ist, dass es eine 50/50 Chance für den Inhalt sichtbar zu werden, die anderen Male, die ich im Debugger sehen kann, dass die Versprechungen haben wurde aufgelöst und loading wird auf false gesetzt, aber der ng-if versteckt den Inhalt. Selbst wenn der Inhalt angezeigt wird, besteht eine gute Chance, dass die ng-Wiederholung controller.responses immer noch leer ist.

Wie kann ich garantieren, dass die ng-if controller.loading als falsch akzeptiert, wenn die Versprechen gelöst wurden, egal wie lange es dauert? Auch die gleiche Frage für die ng-repeat nicht die Werte in controller.responses manchmal sehen. Ich habe eine Zeitüberschreitung in Betracht gezogen, aber das ist nicht die ideale Lösung, da es zwischen einer halben Sekunde und zehn Sekunden dauern kann.

Answer 1

Das Problem ist, dass Sie Promise.all anstelle von $q verwenden. $q ist eine Promise-Bibliothek, die vom Angular-Team erstellt wurde und den $digest-Zyklus für Sie übernimmt.

$q.all(promises).then(function success(response) { 
    for (responseIndex = 0; responseIndex < response.length; responseIndex++) { 
    responses.push(response[responseIndex].data); 
    } 
    controller.loading = false; 
}); 

Read more about $q