javascript - 如何从异步 API 返回 AngularJS promise

Question

AngularJS:从函数返回值

我该如何解决这个问题？

   function byDepartment () {
            var result = null;
            deparmentService.query({
                codDepartment: vm.codDepartment.codDepartment,
                reportBycodDepartment: 1
            }, function (data) {
                var success = JSON.stringify(data.success);
                if (success === false) {
                    console.log(JSON.stringify(data.data));
                    result = data.message;
                } else {
                    result = data.data;
                    console.log('Always has a value: ' + result);
                }
            });
            console.log('Always null: ' + result);
            return result;
        }

Chrome 的控制台回答这个问题: 始终为空:空 总是有一个值:[object Object],[object Object]

我想在下一个函数中使用这个值:

  vm.updateChart = function () {
            vm.testValue = 0;
            if (!vm.codTestRoom) {
                console.log('consulta con departamento');
                vm.testValue = byDepartment();
            } else if (!vm.codEquipment) {
                console.log('Consulta con departamento y testRoom');
                vm.testValue = byDepartmentAndTestRoom();
            } else {
                console.log('Consulta con departamento, testRoom y Equipo');
                vm.testValue = byDepartmentAndTestRoomAndEquipment();
            }
            // console.log('Valor: ' + JSON.stringify(vm.testValue));
        };

在使用 vm.testValue 之后，我将使用 chart.js 绘制图表..

谢谢。

Answer 1

发生这种情况是因为您正在进行异步调用，但处理它时却像处理同步一样。 在 angularjs 中，与在常规 javascript 中一样，等待异步调用的一种解决方案是使用 promises .

在 angularjs 中，promises 很容易通过 $q provider 创建这将帮助您使用 defer() 方法创建新的 promise 。 下面是你如何实现它(记得注入(inject) $q)

function byDepartment () {
    var deferred = $q.defer();
    var result = null;
    deparmentService.query({
        codDepartment: vm.codDepartment.codDepartment,
        reportBycodDepartment: 1
    }, function (data) {
        var success = JSON.stringify(data.success);
        if (success === false) {
            deferred.reject(data.message);
        } else {
            deferred.resolve(result.data);
        }
    });
    return deferred.promise;
}

当调用 byDepartment() 方法时，您需要通过将一个成功函数和一个错误函数传递给 promise 上的 then() 方法来告知在返回的 promise 成功和失败时应该发生什么

vm.updateChart = function () {
    vm.testValue = 0;
    if (!vm.codTestRoom) {
        console.log('consulta con departamento');
        byDepartment()
        .then(
            function (result) {
                vm.testValue = result;
            },
            function (message) {
                console.log(error);
            }
        );
    } else if (!vm.codEquipment) {
        console.log('Consulta con departamento y testRoom');
        vm.testValue = byDepartmentAndTestRoom();
    } else {
        console.log('Consulta con departamento, testRoom y Equipo');
        vm.testValue = byDepartmentAndTestRoomAndEquipment();
    }
    // console.log('Valor: ' + JSON.stringify(vm.testValue));
};