Angular-Filterdienst mit Versprechen

Question

Ich habe folgende Filter:

app.filter("findDivision", function(divisionService) { 

    var isWaiting = false; 
    var returnValue = null; 

    function myFilter(input) { 

     var translationValue = "Loading..."; 
     if(returnValue) 
     { 
      translationValue = returnValue; 
     } else { 
      if(isWaiting === false) { 
       isWaiting = true; 
       divisionService.getDivisionById(input).then(function(data) { 
        console.log("GetTranslation done"); 
        returnValue = data[0].name; 
        isWaiting = false; 
       }); 
      } 
     } 

     return translationValue; 
    } 

    return myFilter; 
}); 

Wo die Funktion i in divisionService wie folgt aussieht nennen:

getDivisionById: function (id) { 
    var d = $q.defer(); 
    $http({ 
     url: api.getUrl2('division'), 
     method: "GET", 
     params: {filters: {id: {EQUAL: id}}} 
    }).success(function (data, status, headers, config) { 
     d.resolve(data); 
    }).error(function (data, status, headers, config) { 
     api.handleError(data); 
     console.log(data); 
     d.reject(data); 
    }); 
    return d.promise 
} 

Leider der Ausgang dieses sieht wie folgt aus:

Kann mir jemand sagen, warum das passiert ist ning? und wie kann ich den richtigen Wert bekommen?

Answer 1

Bei den ersten Aufrufen des Filters ist das Versprechen wahrscheinlich noch nicht gelöst, da der HTTP-Aufruf eine Weile dauert. Ihr Filtercode springt sofort zur Return-Anweisung return translationValue;. In diesem Fall gibt der Filter "Loading ..." zurück.

Leider überprüft der Filter den Filter nicht automatisch bis zum nächsten Digest-Zyklus. Angular hat keine Möglichkeit zu wissen, dass es einen anderen Digest-Zyklus ausführen soll, da sich nichts ändert (keine Benutzerinteraktion oder Änderungen an $ scope). Versuchen Sie als Experiment manuell einen Digest-Zyklus durch Ändern des Modells, z. mit einer input Box mit ng-model. In diesem Moment sehen Sie, dass der Filter erneut ausgewertet wird und die Ausgabe angezeigt wird.