Angular 4 - 动态添加的元标记不起作用答案

【问题标题】：Angular 4 - Dynamically added meta tags not workingAngular 4 - 动态添加的元标记不起作用
【发布时间】：2018-04-15 23:50:34
【问题描述】：

我正在使用 Angular 4 的 Meta 服务 -

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

 constructor(private _router: Router,
    private _meta: Meta) {
 }

afterRequestSuccess(){
    this._meta.addTag({ property: 'og:description', content: "desc comes from api response" });
    this._meta.addTag({ property: 'og:image', content: "Image path comes from api resonse" });
}`

我可以在 google chorme 开发人员工具中看到添加的标签，但我正在尝试使用 facebook Graph Object Debugger https://developers.facebook.com/tools/debug/og/object 那个时间没有显示在调试器响应列表中。

有人可以帮忙吗？提前致谢。

【问题讨论】：

什么网址？我怀疑调试器运行 JavaScript，我需要服务器端渲染才能工作。
您询问的是哪个网址？如果我添加硬代码元标记，它会正确显示。
1.调试器需要一个 URL。如果没有它，我们怎么能复制这个问题呢？ 2. 当然，因为它们是在实际的 HTML 中，而不是由 JS 在运行时生成的。
您确定 facebook 能够正确处理单页应用程序中的元标记吗？

标签： html angular meta-tags

【解决方案1】：

需要用到-https://universal.angular.io/

如果您想转换现有应用，请按照给定链接中的步骤操作 - https://codeburst.io/angular-server-side-rendering-using-angular-cli-bbde0c0eefe9

【讨论】：