Hello, I'm encountering an issue with a dynamic blog page. I am trying to update meta tags using data fetched from the page. Here's the code snippet:
getBlogPost() {
this.http.get(...)
.subscribe(result => {
this.blogPost = result;
this.meta.updateTag({ name: 'description', content: this.blogPost.fields.metaDescription });
this.meta.updateTag({name: 'robots', content: 'INDEX, FOLLOW'});
this.title.setTitle(this.blogPost.fields.blogName);
this.meta.updateTag({name: 'twitter:image:src', content: this.blogPost.includes.Asset[0].fields.file.url });
this.meta.updateTag({name: 'twitter:title', content: this.blogPost.fields.blogName });
this.meta.updateTag({name: 'twitter:description', content: this.blogPost.fields.metaDescription });
this.meta.updateTag({property: 'og:title', content: this.blogPost.fields.blogName});
this.meta.updateTag({property: 'og:description', content: this.blogPost.fields.metaDescription});
this.meta.updateTag({property: 'og:image', content: this.blogPost.includes.Asset[0].fields.file.url });
this.meta.updateTag({property: 'og:image:secure_url', content: this.blogPost.includes.Asset[0].fields.file.url});
})
}
Despite following the right steps, I am not seeing the updated meta tags when I check the source code or SEO tools. Can anyone provide a solution to this problem?
Thank you in advance!