我尝试了几种不同的方法,并且我已经找到了示例,但是我没有找到一个在设置元数据之前从对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 });