Angular Universal 5-Meta Service无法正常工作 [英] Angular Universal 5 - Meta Service not working

问题描述

我的meta标签可用于Facebook和Twitter，但是我却以某种方式破坏了它们.我看了一些例子，但看不到问题. (没有错误.)标签仅与index.html中的默认值保持不变.我正在使用Angular Universal 5.

I had my meta tags working for Facebook and Twitter but I've somehow broken them. I looked at examples, but I can't see the issue. (There are no errors.) The tags just don't change from the defaults in index.html. I'm using Angular Universal 5.

与我发现的示例不同，我没有在构造函数中编写标签.不知道这是否是一个因素.我一定缺少使用Meta服务的一些规则.这是代码...

Unlike the examples I found, I'm not writing the tags in the constructor. Not sure if that's a factor. I must be missing some rule of using the Meta service. Here's the code...

    import { Meta } from '@angular/platform-browser';
    ...

    constructor( ... private metaService: Meta ... ) {}

    ngOnInit () { 
    ...  

        // <!-- Facebook meta data -->
        this.metaService.addTags([
         {property: 'og:title', content: 'test' },
         {property: 'og:url', content: 'url' },
        ]);
        // <!-- Twitter meta data -->
        this.metaService.addTag({name: 'twitter:title', content: 'test });
   ...
   }

推荐答案

如果标签已经存在，则需要使用updateTag而不是addTag

If the tags are already there, you need to use updateTag instead of addTag

查看源代码，addTag不会添加dom标签(如果它已经存在于dom中)(如index.html中的内容)

Looking at the source code, addTag does not add the meta tag if it's already present in the dom (like in index.html)

https://github .com/angular/angular/blob/master/packages/platform-b​​rowser/src/browser/meta.ts

注意 updateTag确实将元添加到dom中(如果尚不存在)

Note updateTag does add the meta to the dom if it does not already exists

这篇关于Angular Universal 5-Meta Service无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！