Question

我将我的网站移动到Angular通用SSR，在我搬家的过程中，我遇到了一些我认为普遍会解决的问题。

我想添加元标记，例如描述，关键字等（每页不同）。

使用titleService作为角度建议工作得很好，它改变了页面的标题。但是，如果我登陆主页然后从那里导航到其他页面，标题不会改变，但是当我查看源代码时，我看到源中的更改但是在VIEW的选项卡上没有。如果我登陆页面（或点击刷新），页面将使用正确的标题进行更新。

我尝试添加标题元标记，但没有任何作用：

this.meta.updateTag( {name: "description", content: 'test1234});

this.meta.addTag({name: 'description', content: 'Content description' });

OR

using vanilaJS
 var doc = (<HTMLMetaElement>document.getElementById('description'));
doc.content = "test1234";

元头在标题部分没有变化。我不知道为什么。任何帮助可以帮助.. 感谢

Answer 1

要为Angular Universal-SSR设置元标记（仅在Angular 2上尝试过），应使用Renderer。要设置示例标题（或更新标题），您可以通过以下方式进行操作：Link for solution

要设置元标记，您需要： 1.导入渲染器和文档

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

2。将这些依赖项添加到构造函数中：

@Inject(DOCUMENT) private document: any,
private renderer: Renderer

3。添加元标记 -示例

//-- Create new meta element inside of head tag
let elem = renderer.createElement(document.head, "meta");

//-- Set meta attributes
renderer.setElementAttribute(elem, 'name', 'description');
renderer.setElementAttribute(elem, 'content', 'Some test decription');

当您打开“查看页面源代码”时，其结果应该在head标签内：

角度通用服务器端渲染，元标记

1 个答案: