javascript - 如何从异步 API 返回 AngularJS 承诺
问题描述
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 的控制台回答这个问题: Always null: null Always have a value: [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 绘制图表。
谢谢。
解决方案
发生这种情况是因为您正在执行异步调用但像同步一样处理它。在 angularjs 中,就像在常规 javascript 中一样,等待异步调用的一种解决方案是使用promises。
在 angularjs 中,promise 很容易由$q 提供程序创建,这将帮助您使用 defer() 方法创建新的 Promise。下面是你如何实现它(记得注入 $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));
};
推荐阅读
- javascript - 如何使用延迟运算符在 Angular 或 rxjs 中延迟 1 分钟后的方法调用
- python - 如何删除这样的错误(无法使用此索引类型执行 __mod__:索引)?
- java - Spring Boot 执行器 - Java 端点
- python - Python使用另一个列表对字典列表进行排序
- c# - 在 WPF C# 应用程序中使用 Xceed DateTimePicker 时,为什么在使用 OneWay 绑定时值只更新一次?
- r - 使用 R:如何将两个数字与与选项(数字 = n)相关的浮点问题进行比较,以及数字是如何引入的?
- powershell - 使用 PowerShell 比较文件夹和子文件夹
- swift - swift 将文本覆盖到另一个变量中
- java - 石英不触发触发器
- java - (已关闭)Maven 在 Java 11 中不起作用我应该降级吗?