Angular 承诺 async/await 失败
Angular promise with a async/await failure
到目前为止,我所看到的解决问题的建议似乎并不适用,或者我有很大的误解(我已经有一段时间没有接触全栈了)。我有一项服务成功命中 Spring 引导后端以获取进程列表:
function getReportProcesses(){
var deferred = $q.defer();
var url = "fermentationReports/processes";
httpService.get(url).then(function (data){
deferred.resolve(data);
}, function(msg){
var errMsg = "failed to get report processes: " + msg;
deferred.reject(errMsg);
});
return deferred.promise;
}
我的 objective 是从下拉工厂点击服务,将列表变成 JSON,然后将其传递给由下拉指令填充的下拉列表。当指令调用以下行以获取 JSON:
var data = ReportDdlFactory.getReportName();
addAllTo(data, $scope.addAll);
在将 data
作为 undefined
添加到范围之前,它不会等待 getReportName()
中的 httpService
到 return。这是工厂中的原始方法:
function getReportName() {
try {
FermentationReportsService.getReportProcesses().then(function (data) {
if (data.processes !== undefined) {
var output = {"data": []};
for (var i = 0; i < data.processes.length; i++) {
var currentLine = {"value": data.processes[i], "label": data.processes[i]};
output.data.push(currentLine);
}
return output;
} else {
return {
"data": [
{"value": "ERROR OBTAINING PROCESSES", "label": "ERROR OBTAINING PROCESSES"}]
};
}
});
} catch (err) {
console.log("error caught: " + err);
}
}
我试图将其更改为使用 async/await,因为 getReportProcesses()
已经 return 是一个承诺:
async getReportName() {
try {
await FermentationReportsService.getReportProcesses().then(function (data) {
if (data.processes !== undefined) {
var output = {"data": []};
for (var i = 0; i < data.processes.length; i++) {
var currentLine = {"value": data.processes[i], "label": data.processes[i]};
output.data.push(currentLine);
}
return output;
} else {
return {
"data": [
{"value": "ERROR OBTAINING PROCESSES", "label": "ERROR OBTAINING PROCESSES"}]
};
}
});
} catch (err) {
console.log("error caught: " + err);
}
}
但我总是从 jshint 得到这个:
14 | async getReportName() {
^ Expected an assignment or function call and instead saw an expression.
14 | async getReportName() {
^ Missing semicolon.
14 | async getReportName() {
^ Missing semicolon.
17 | await FermentationReportsService.getReportProcesses().then(function (data) {
^ Expected an assignment or function call and instead saw an expression.
17 | await FermentationReportsService.getReportProcesses().then(function (data) {
^ Missing semicolon.
8 | getReportName: getReportName,
^ 'getReportName' is not defined.
14 | async getReportName() {
^ 'getReportName' is not defined.
14 | async getReportName() {
^ 'async' is not defined.
我觉得我可能让这件事变得比需要的更难,或者我可能遗漏了一些简单的东西?
编辑:
经过更多研究后,我确定该应用程序 运行 为 'strict'
,强制执行 ECMA 5。是否有一种方法可以在不使用 ES6 方法的情况下继续之前强制响应?
通过使用 async/await,您不再需要使用 then
async function getReportName() {
try {
const data = await FermentationReportsService.getReportProcesses();
if (data.processes !== undefined) {
var output = { data: [] };
for (var i = 0; i < data.processes.length; i++) {
var currentLine = {
value: data.processes[i],
label: data.processes[i],
};
output.data.push(currentLine);
}
return output;
} else {
return {
data: [
{
value: 'ERROR OBTAINING PROCESSES',
label: 'ERROR OBTAINING PROCESSES',
},
],
};
}
} catch (err) {
console.log('error caught: ' + err);
}
}
查看这篇文章了解更多信息javascript.info async/await
我可能会这样做:
function getReportName() {
return FermentationReportsService
.getReportProcesses()
.then(function(data) {
if (data.processes === undefined) {
return { data: [
{ value: "ERROR OBTAINING PROCESSES", label: "ERROR OBTAINING PROCESSES" }
]};
}
return {
data: data.processes.map(function(process) {
return { value: process.value, label: process.value };
})
};
})
.catch(function(err) {
console.log("error caught: " + err);
});
}
到目前为止,我所看到的解决问题的建议似乎并不适用,或者我有很大的误解(我已经有一段时间没有接触全栈了)。我有一项服务成功命中 Spring 引导后端以获取进程列表:
function getReportProcesses(){
var deferred = $q.defer();
var url = "fermentationReports/processes";
httpService.get(url).then(function (data){
deferred.resolve(data);
}, function(msg){
var errMsg = "failed to get report processes: " + msg;
deferred.reject(errMsg);
});
return deferred.promise;
}
我的 objective 是从下拉工厂点击服务,将列表变成 JSON,然后将其传递给由下拉指令填充的下拉列表。当指令调用以下行以获取 JSON:
var data = ReportDdlFactory.getReportName();
addAllTo(data, $scope.addAll);
在将 data
作为 undefined
添加到范围之前,它不会等待 getReportName()
中的 httpService
到 return。这是工厂中的原始方法:
function getReportName() {
try {
FermentationReportsService.getReportProcesses().then(function (data) {
if (data.processes !== undefined) {
var output = {"data": []};
for (var i = 0; i < data.processes.length; i++) {
var currentLine = {"value": data.processes[i], "label": data.processes[i]};
output.data.push(currentLine);
}
return output;
} else {
return {
"data": [
{"value": "ERROR OBTAINING PROCESSES", "label": "ERROR OBTAINING PROCESSES"}]
};
}
});
} catch (err) {
console.log("error caught: " + err);
}
}
我试图将其更改为使用 async/await,因为 getReportProcesses()
已经 return 是一个承诺:
async getReportName() {
try {
await FermentationReportsService.getReportProcesses().then(function (data) {
if (data.processes !== undefined) {
var output = {"data": []};
for (var i = 0; i < data.processes.length; i++) {
var currentLine = {"value": data.processes[i], "label": data.processes[i]};
output.data.push(currentLine);
}
return output;
} else {
return {
"data": [
{"value": "ERROR OBTAINING PROCESSES", "label": "ERROR OBTAINING PROCESSES"}]
};
}
});
} catch (err) {
console.log("error caught: " + err);
}
}
但我总是从 jshint 得到这个:
14 | async getReportName() {
^ Expected an assignment or function call and instead saw an expression.
14 | async getReportName() {
^ Missing semicolon.
14 | async getReportName() {
^ Missing semicolon.
17 | await FermentationReportsService.getReportProcesses().then(function (data) {
^ Expected an assignment or function call and instead saw an expression.
17 | await FermentationReportsService.getReportProcesses().then(function (data) {
^ Missing semicolon.
8 | getReportName: getReportName,
^ 'getReportName' is not defined.
14 | async getReportName() {
^ 'getReportName' is not defined.
14 | async getReportName() {
^ 'async' is not defined.
我觉得我可能让这件事变得比需要的更难,或者我可能遗漏了一些简单的东西?
编辑:
经过更多研究后,我确定该应用程序 运行 为 'strict'
,强制执行 ECMA 5。是否有一种方法可以在不使用 ES6 方法的情况下继续之前强制响应?
通过使用 async/await,您不再需要使用 then
async function getReportName() {
try {
const data = await FermentationReportsService.getReportProcesses();
if (data.processes !== undefined) {
var output = { data: [] };
for (var i = 0; i < data.processes.length; i++) {
var currentLine = {
value: data.processes[i],
label: data.processes[i],
};
output.data.push(currentLine);
}
return output;
} else {
return {
data: [
{
value: 'ERROR OBTAINING PROCESSES',
label: 'ERROR OBTAINING PROCESSES',
},
],
};
}
} catch (err) {
console.log('error caught: ' + err);
}
}
查看这篇文章了解更多信息javascript.info async/await
我可能会这样做:
function getReportName() {
return FermentationReportsService
.getReportProcesses()
.then(function(data) {
if (data.processes === undefined) {
return { data: [
{ value: "ERROR OBTAINING PROCESSES", label: "ERROR OBTAINING PROCESSES" }
]};
}
return {
data: data.processes.map(function(process) {
return { value: process.value, label: process.value };
})
};
})
.catch(function(err) {
console.log("error caught: " + err);
});
}