Angular 6 Meta服务,包含来自Web服务的动态元数据

我正在尝试使用从Web服务检索的数据来更新Angular 6(更新：现在的Angular 7)Universal应用程序(使用Meta和Title)中的元数据.我专门为Twitter和Facebook卡做这个.我知道他们的抓取工具不执行 JavaScript,这就是我使用Angular Universal在服务器端设置元数据的原因.我正在使用 Facebook Sharing debugger tool检查结果.

我尝试了几种不同的方法,并且我已经找到了示例,但是我没有找到一个在设置元数据之前从对Web服务的异步调用中检索数据的方法. (请注意,我在Angular Universal 4应用程序中成功使用此服务与Web服务.)

使用下面的代码,“og：url”标记被正确设置为不需要Web服务调用来获取数据.但是,标题未正确设置.如果我将“setTitle”调用移动到ngOnInit并提供一个字符串,那么它可以工作 – 但是从Web服务获取数据却没有.

我已经尝试使用服务来收集数据然后设置元数据,但这也不起作用.我从解析器获取数据,但它没有解决Facebook / Twitter问题.

ngOnInit() {
    const metaUrl = 'https://www.test.com' + this._router.url;
    this._metaService.updateTag({ property: 'og:url',content: metaUrl });

    this._sub = this._route.params.subscribe(params => {
      const code = params['person'];
      this.getInfo(code);
    });
}

getInfo(code: string) {
  this._myWebService.getPerson(code).subscribe(
      data => {
        this._person = data;
        // set dynamic metadata
        const metaTitle = this._person.name + ' | site description';
        this._titleService.setTitle(metaTitle);
        this._metaService.updateTag({ name: 'twitter:title',content: metaTitle });
  });

}

更新：我还尝试使用解析器首先获取数据,以便我可以在onInit中使用它.它不起作用.

{ path: 'view/:person',component: ViewComponent,resolve: { person: ViewResolver },data: { person: ViewResolver }
  }

然后在onInit：

const data: any = this._routeActive.snapshot.data;
this.metaTitle = data.person.value.name;
this._metaService.updateTag({property: 'og:title',content: this.metaTitle });
this._metaService.updateTag({name: 'twitter:title',content: this.metaTitle });