我最近切换到 angular2 Universal 以使我的 SPA 被搜索引擎抓取,Angular Universal 非常适合做这个用例,当我尝试为每个页面注入动态元数据时遇到问题,我尝试使用 ElementRef 和 Renderer ,并且我使用了一些angular2-meta服务,但是当平台不是浏览器时它不起作用
以下代码是我最近的尝试
import { Component, AfterViewInit, Renderer, Inject, ElementRef } from '@angular/core';
import { DOCUMENT } from '@angular/platform-browser';
import { DomRenderer ,NodeDomRenderer} from 'angular2-platform-node';
import {isBrowser, isNode } from 'angular2-universal';
import { Meta, MetaDefinition } from '../../services/meta.service';
@Component({
selector: 'home',
templateUrl: './home.component.html'
})
export class HomeComponent {
constructor(public meta:Meta) {
const name: MetaDefinition = {name: 'application-name', content: 'Name of my application'};
const desc: MetaDefinition = {name: 'description', content: 'A description of the page'};
const tags: HTMLMetaElement[] = this.meta.addTags([name, desc]);
}
}
当我将代码包装在构造函数中时
if(isBrowser)
,它只在客户端呈现,但是当我查看页面的源代码时,它没有呈现
当我尝试使用渲染器the this.renderer.createElement
功能进行渲染时不起作用
在将页面发送到客户端之前,是否有任何解决方案或想法可以在服务器中呈现元标记,我正在使用ASP.NET Core 1.1的Angular Universal
提前致谢