Question

在我的应用程序中，我需要在完成一些API请求订阅后更新元标记。在ngInit方法中，我添加了一些标签-

addMetaTags(config){
        this.title.setTitle(config.title);

        this.meta.addTag({ property: 'og:type', content: config.type });
        this.meta.addTag({ property: 'og:site_name', content: 'AB' });
    }

工作正常，我可以在源HTML中看到该元内容。

但是，完成订阅后，我先删除标签，然后再更新标签来更新meta。

removeMetaTags(){
        let description: HTMLMetaElement = this.meta.getTag('name = "description"');
        this.meta.removeTagElement(description);

        let ogType: HTMLMetaElement = this.meta.getTag('name = "og:type"');
        this.meta.removeTagElement(ogType);
        let ogSite: HTMLMetaElement = this.meta.getTag('name = "og:site_name"');
        this.meta.removeTagElement(ogSite);
        let ogTitle: HTMLMetaElement = this.meta.getTag('name = "og:title"');
        this.meta.removeTagElement(ogTitle);
    }

updateMetaTags(config){
        this.title.setTitle(config.title);

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

        this.meta.updateTag({ property: 'og:type', content: config.type });
        this.meta.updateTag({ property: 'og:site_name', content: 'ABCD' });
        this.meta.updateTag({ property: 'og:title', content: config.title });

        let description: HTMLMetaElement = this.meta.getTag('name = "description"');
        console.log(description);
    }

在控制台中，我看到了description元标记元素，但是当看到源HTML时，它不存在。

提前谢谢！

Answer 1

我认为您DOM没有更新，建议使用ChangeDetectorRef

updateTag: Observable<any>;
_data;
constructor(private cd: ChangeDetectorRef) { }

调用via服务

  this.example.subscribe(data => {
        this._data = data;
        this.meta.updateTag({ property: 'og:title', content: config.title });
    });

Angular updateTag函数不会更新源代码视图HTML中的元标记

1 个答案: