服务器端渲染、角度 5 和订阅。

Question

我正在尝试在 Angular 5 应用程序上实现服务器端渲染。当应用程序构建并提供服务时，一切正常，但是页面的源没有正确呈现。我发现如果我使用订阅和异步管道，这可以解决问题——我在屏幕上看到的内容也在源代码中。但是，如果我尝试通过管道传输订阅并使用返回值执行任何操作，则 html 会正确呈现，但源不是。

这是它在打字稿中正常工作时的实现方式：

ngOnInit() {
  this.httpResponse$ = this._dataService
   .send(new BrochureRequest(this._stateService.params.propertyId));
}

这是html

<div *ngIf="httpResponse$ | async as httpResponse; else loading">
  {{content goes here}}
</div>

在这种情况下，信息显示在屏幕上，即 html 等待异步响应 - 至关重要的是 - 屏幕上的所有数据都反映在源中。

但是，在许多情况下，我希望对从服务返回的数据执行一些操作 - SEO、广告定位等......在这种情况下，我想做这样的事情

ngOnInit() {
    this.httpResponse$ = this._dataService
       .send(new BrochureRequest(this._stateService.params.propertyId)).pipe(
        tap((httpResponse) => {
            this.activeLink = 
            this._headerService.getActiveLink(this.httpResponse.Id);
            this._seoService.setSeoDetails(this.httpResponse.SeoDetails);
            // do more stuff
            return httpResponse;
        }));
  }

在这种情况下，信息按预期显示在屏幕上，并且调用了所有其他函数，但是该组件中的任何内容都没有出现在源代码中。就像 html 最初是在没有任何数据的情况下提供的，并且在填充数据时没有更新。

任何想法为什么我没有在页面源中获取所有数据？有没有办法可以延迟任何 html 渲染，直到返回 httpResponse？

Answer 1

也许您可以使用像 ngAfterViewChecked 这样的事件？阅读有关角度生命周期钩子的更多信息 这里https://angular.io/guide/lifecycle-hooks