场景

为了做页面的seo优化,我们需要对每篇文章设置动态的页面标题和关键字,描述信息,但是angular8 的页面是单页面,只有一个入口文件处设置了标题,这个时候我们就需要动态的设置这些信息,让爬虫可以更精准的抓取到我们的文章

具体做法

  • 引入 Title, Meta
  1. import { Title, Meta } from '@angular/platform-browser';
  2. constructor(private titleService: Title,
  3. private metaService: Meta) { }
  • 动态设置
  1. //动态设置title
  2. this.titleService.setTitle("Angular8 动态设置页面title和页面meta描述和关键字"+ " | W空间");
  3. //设置页面的meta描述信息
  4. this.metaService.updateTag({ name: 'description', content:"关于Angular8 动态设置页面title和页面meta描述和关键字" });
  5. //设置页面的meta关键字信息
  6. this.metaService.updateTag({ name: 'keywords', content: "前端,angular8,W空间" });