Рендеринг на стороне сервера, угловой 5 и подписки. - PullRequest
0 голосов
/ 04 октября 2018

Я пытаюсь реализовать рендеринг на стороне сервера в угловых 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?

1 Ответ

0 голосов
/ 04 октября 2018

может быть, вы можете использовать такое событие, как ngAfterViewChecked?Подробнее о угловых крюках жизненного цикла можно узнать здесь https://angular.io/guide/lifecycle-hooks

...