调用服务时异步调用不起作用-Angular 8

Question

同步在使用httpClient、post方法调用API服务时不起作用，并且不等待响应的返回

组件.ts

this.juiciosService.createJuicio(this.juicio).then(
(res: any) => {
if(res.ok == 200){
Swal.fire({
//position: 'top-end',
icon: 'success',
title: 'Cedula agregada con exito',
showConfirmButton: false,
timer: 2000
})
this.detalleJuicio(res.data)
}
else {
Swal.fire({
//position: 'top-end',
icon: 'success',
title: 'No se pudo agregar la cedula',
showConfirmButton: false,
timer: 2000
})
}
this.spinnerService.hide();
}
)

服务.ts

async createJuicio(juicio): Promise<Juicio> {
console.log(juicio);
const url = this.API_URL + 'juicios/Crearjuicios/';
return await this.http
.post<Juicio>(url, juicio).toPromise()
.then(res => res)
}

Answer 1

您可以将代码更改为：

async methodName()
{
let res = await this.juiciosService.createJuicio(this.juicio);
if(res.ok == 200){
Swal.fire({
//position: 'top-end',
icon: 'success',
title: 'Cedula agregada con exito',
showConfirmButton: false,
timer: 2000
});
this.detalleJuicio(res.data)
}
else{

Swal.fire({
//position: 'top-end',
icon: 'success',
title: 'No se pudo agregar la cedula',
showConfirmButton: false,
timer: 2000
})

}
}

通过这种方式，它将作为一个异步函数工作。

另外，不要忘记对其中一个函数执行异常处理。因为如果您的HTTP调用失败，Spinner似乎不会隐藏。