如何在有角度的生命周期挂钩中使用等待

Question

堆叠litz代码

我正在开发一个角度应用程序来导出PDF，但在导出的PDF中看不到数据值。我的方法：我有两个组件(登录，主页(，在登录组件中创建了一个按钮(导出(，它将引导用户到主页组件，在ViewInit之后，它将生成pdf。我在ngAfterViewInit((生命周期挂钩中编写了pdf生成代码。当我试图等待回应时，它不起作用。

我在home.component.ts中尝试了以下两种方法，但仍然无效

ngAfterViewInit(): void {
this.fetchUserData().then(() => {
this.generatepdf();
this.router.navigateByUrl('login');
});
}

async ngAfterViewInit(): void {
await this.fetchUserData();
this.generatepdf();
this.router.navigateByUrl('login');
}

有没有一种方法可以等待结果并生成PDF？

预期结果：等待/提取的响应应出现在生成的PDF中：(

Answer 1

您的pdf文件是在执行更改检测之前生成的。将private cdr: ChangeDetectorRef注入构造函数，并在设置this.users之后调用this.cdr.detectChanges()。

叉式堆叠式

Answer 2

是的，您可以使用async/await模式：

async ngAfterViewInit(): Promise<void> {
await this.fetchUserData();
this.generatepdf();
this.router.navigateByUrl('login');
}

演示：https://stackblitz.com/edit/jspdf-final-nwesmc?file=app%2Fviews%2Fhome%2Fhome.component.ts