Компонент AngularJS и ожидание функции синхронизации

Question

У меня проблемы с "каким-то" ожиданием или моей функцией defineDamage возвращает результат до того, как представление будет нарисовано, оставляя меня с пустыми списками, однако функция проходит и "в конечном итоге" получает данные ... Не нужно говорить, что уже слишком поздно..

Так что мне интересно, есть ли способ заставить просмотр wait (throttle) , обновить позже или какие-либо другие опции, которые у меня могут быть.

angularApplication.component("damage", {
    bindings: {
        results: "=",
    },
    templateUrl: "views/damage-results.html",
    controller: function(Champion) {

        let $ctrl = this;

        const determineDamage = function (options) {
            //return "blabla"; --this would print "blabla" properly
            let champion = new Champion({options:options});
            return champion.fetch().then(() => {
                champion.findName().then((name) => {
                    console.log(name);
                    //name is logged but well, "too late"
                    return name;
            });
        };

        $ctrl.$onInit = function () {
            $ctrl.results = $ctrl.results || [];
            $ctrl.determineDamage = determineDamage;
        };

HTML:

    <li ng-repeat="champs in $ctrl.results">
        <div class="champion__list">{{$ctrl.determineDamage(champ.id)}}</div>
    </li>

Я "искал всю сеть", и я не могу понять, как получить мой результат ... также обратите внимание, что если бы я поставил return "blabla"просмотр получит эту информацию.Так что, к моему плохому пониманию, все в порядке, за исключением того, что мой компонент не ждет, пока функция defineDamage пройдет до конца.Любые идеи или советы?

Редактировать: примечание: это не пустое, что я получаю, если быть точным, я получаю [объект Обещание], возвращенный как из моей возвращаемой строки champion.fetch.

Answer 1

это парень из gitter: D

Итак, здесь у вас есть функция defineDamage, которая не возвращает значение, а обещание.

В этом обещании есть несколько методов, которыеможет быть прикован цепью

then

catch

finally

Это означает, что когда вы вызываете defineDamage (), вы получите объект Promise с этими методами

var promise = determineDamage();

determineDamage
.then(function(response){
//Called on succcess
})
.catch(function(error){
//Called on error
})
.finally(function(){
//Always called at the end
})

В вашем случае вы хотите получитьуспешный ответ, вам даже не нужно давать обещание своей собственной переменной

determineDamage()
.then(function(response){
$ctrl.results = response;
});

Функция, переданная функции then, будет вызвана через некоторое время в будущем, и ваш ответ будет передан в качестве аргумента.

Это означает, что ваш однопоточный браузер может вызвать сто из них подряд, а затем продолжить интерпретацию, не блокируя поток, и в какой-то момент будет выполнен обратный вызов, содержащий успех или ошибку, содержащий ваш ответ.