如何在 angular 4 中使用 Meta 删除标签

Question

当我尝试删除 tags.its 时，我可以在 index.html 中使用 angular 4.but 中的 Meta 概念动态设置标签删除，我怎样才能删除我之前添加的标签？

这是我尝试过的：设置标签：

import {Meta ,MetaDefinition } from '@angular/platform-browser';
@Component({
  selector: 'app-share-video',
  templateUrl: './share-video.component.html',
  })
export class ShareVideoComponent implements OnInit {
constructor(public metaServic:Meta){}
ngOnInit(){
    const ogtitle: MetaDefinition   =  { name: 'og:title', content: 'Grace' };
    const ogSitename: MetaDefinition = { name: 'og:site_name', content: 'My Favourite Albums'};
    const ogUrl: MetaDefinition = { name: 'og:url', content: 'https://angular.io/docs/ts/latest/api/platform-browser/index/Meta-class.html'};
    const ogdesc: MetaDefinition = { name: 'og:description', content: 'angular 4 share video description'};
    this.metaService.addTag(ogtitle);
    this.metaService.addTag(ogSitename);
    this.metaService.addTag(ogUrl);
    this.metaService.addTag(ogdesc);
  }        
ngOnDestroy() {
   this.metaService.removeTag("property='og:title'");
   this.metaService.removeTag("property='og:site_name'");
   this.metaService.removeTag("property='og:url'");
   this.metaService.removeTag("property='og:description'");
    }
}

在销毁方法中，我正在删除标签，但这些标签并没有删除，我该如何删除标签？接着是：meta tags blog

Answer 1

您尝试使用的属性选择器是 name，而不是 property。

你必须使用

this.metaService.removeTag("name='og:title'");
this.metaService.removeTag("name='og:site_name'");
this.metaService.removeTag("name='og:url'");
this.metaService.removeTag("name='og:description'");

而不是

this.metaService.removeTag("property='og:title'");
this.metaService.removeTag("property='og:site_name'");
this.metaService.removeTag("property='og:url'");
this.metaService.removeTag("property='og:description'");

plnkr

Answer 2

Angular 6+ 你需要使用 for this.metaService.removeTag("property='og:description'") 等...因为 this.metaService.removeTag("name='og:title'"); 不起作用。

Answer 3

所有 OpenGraph tags 都应该使用 "property"，而不是 "name" 来添加和删除标签。您使用 "name" 添加并尝试使用 "property".

删除

固定码：

  ngOnInit() {
    const ogtitle: MetaDefinition =  { property: 'og:title', content: 'Grace' };
    const ogSitename: MetaDefinition = { property: 'og:site_name', content: 'My Favourite Albums'};
    const ogUrl: MetaDefinition = { property: 'og:url', content: 'https://angular.io/docs/ts/latest/api/platform-browser/index/Meta-class.html'};
    const ogdesc: MetaDefinition = { property: 'og:description', content: 'angular 4 share video description'};
    this.metaService.addTag(ogtitle);
    this.metaService.addTag(ogSitename);
    this.metaService.addTag(ogUrl);
    this.metaService.addTag(ogdesc);
  }

  ngOnDestroy() {
   this.metaService.removeTag("property='og:title'");
   this.metaService.removeTag("property='og:site_name'");
   this.metaService.removeTag("property='og:url'");
   this.metaService.removeTag("property='og:description'");
  }

对于 Twitter Cards 等其他页面元数据或 description、author、keywords 等普通元数据，您可以使用 "name".

"name='description'"
"name='author'"
"name='twitter:description'"
"name='twitter:image'"
"name='twitter:image:alt'"
"name='keywords'"

如何在 angular 4 中使用 Meta 删除标签

How to remove the tags using Meta in angular 4

tags

meta-tags

angular