0

在 an中，angular component我从 a 生成图像service http call，然后我想在网站上显示。但是，生成图像所需的时间比加载站点所需的时间要长。

因此，当它最终加载时，我不得不额外刷新几次以查看/显示实际图像。

如何ngOnit在显示页面之前等待所有内容生成和加载？

this.someService.generateImage().subscribe(x => {
    console.log('Image is now in folder')}

我希望在此呼叫之后显示页面。

对此有任何提示吗？

4

4 回答 4

2

你可以这样做：

标记：

<div *ngIf="!isLoading">
   // do not show till loading
</div>

零件：

isLoading = true;

this.someService.generateImage().subscribe((x) => {
   console.log('Image is now in folder')
   this.isLoading = false;
})
于 2018-06-19T10:51:05.817 回答
0

您可以使用ngAfterViewInit()它在 dom 完全加载后执行

于 2018-06-19T10:56:31.723 回答
0

在您的 ngOnInit 上使用：

  ngOnInit() {
   this.someService.generateImage().subscribe(x => {
    //load page content functions.
    console.log('Image is now in folder')
   });
  }

这是一种解决方法，因为 ngOnInit() 本身不等待异步调用

于 2018-06-19T10:28:10.117 回答
0

为什么停止 ngOnInit 执行而不是让它加载所有依赖项只是不显示它，您可以应用的 hack 是通过具有加载器服务的阻塞加载器隐藏完整页面的内容，并在图像时显示页面的内容生成。像这样的东西。

ngOnInit() {
   loaderService.show();
   this.someService.generateImage().subscribe(x => {
     loaderService.hide();
     console.log('Image is now in folder')
   }
   [Extra dependencies stuff .....]
}
于 2018-06-19T10:29:35.477 回答