Angular 2/4/Universal - 如何使用JSON-LD数据？

Question

我有一个Angular 4 Universal应用程序,我想开始使用JSON-LD格式的微数据.

它使用script带有一些内容的标签,例如:

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  ...
}
</script>

由于此数据应该按视图更改,我正在寻找一种方法在Angular 4中将路径更改注入此数据.目前,脚本标记从模板中删除.使用变通方法时docuemnt.createElement,这不适用于服务器端的Angular Universal应用程序.

我该怎么做？

编辑

我使用Angular 4.xx,现在称为普通Angular.我document是这样注射的:

import { DOCUMENT } from '@angular/platform-browser';

class Test {
  constructor(@Inject(DOCUMENT) private _document) {
  }

  public createScriptTag() {
    this._document.createElement('script'); // doesn't work server-side
  }
}

Answer 1

编辑：正如评论中所指出的，该解决方案是一个 hacky 解决方案，应谨慎使用。

\n\n

您可以注入一些其他类型和函数“\xc9\xb5getDOM”和“\xc9\xb5DomAdapter”来获取对 dom 的引用。很抱歉将其称为“某些”服务和功能，因为我不知道他们为什么这样命名。我只是研究了源代码以及 Angular 团队如何使用 MetaService 来实现这一点。

\n\n

import { Inject } from \'@angular/core\';\nimport { Meta, Title } from \'@angular/platform-browser\';\nimport { \xc9\xb5getDOM, \xc9\xb5DomAdapter, DOCUMENT } from \'@angular/platform-browser\';\n\n@Injectable()\nexport class SeoService {\n\n  private dom: \xc9\xb5DomAdapter;\n\n  constructor(@Inject(DOCUMENT) private document: any,\n              private titleService: Title,\n              private metaService: Meta) {\n\n    this.dom = \xc9\xb5getDOM();\n\n    let scriptEl = this.dom.createElement(\'script\');\n    // ..\n\n  }\n}\n

\n\n

我已经对此进行了测试并在生产中使用它。

\n