angular universal update meta tags with dynamic content












2














Hey I'm having an issue I have this blogs page that brings in dynamic data, and with that data I want to use it to populate meta tags so for example I'm doing something like this



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});

     })

}


Now all signs point to this should work but I don't see the updated meta tags when I view the source code and I don't see them when I check SEO tools...



Is there a solution to this?



Thanks in Advance!!






javascript angular typescript angular-universal







share|improve this question
























  • The answers to this question might help.
    – Rolvernew
    Nov 21 '18 at 8:14


















2














Hey I'm having an issue I have this blogs page that brings in dynamic data, and with that data I want to use it to populate meta tags so for example I'm doing something like this



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});

     })

}


Now all signs point to this should work but I don't see the updated meta tags when I view the source code and I don't see them when I check SEO tools...



Is there a solution to this?



Thanks in Advance!!






javascript angular typescript angular-universal







share|improve this question
























  • The answers to this question might help.
    – Rolvernew
    Nov 21 '18 at 8:14
















2












2








2







Hey I'm having an issue I have this blogs page that brings in dynamic data, and with that data I want to use it to populate meta tags so for example I'm doing something like this



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});

     })

}


Now all signs point to this should work but I don't see the updated meta tags when I view the source code and I don't see them when I check SEO tools...



Is there a solution to this?



Thanks in Advance!!






javascript angular typescript angular-universal







share|improve this question















Hey I'm having an issue I have this blogs page that brings in dynamic data, and with that data I want to use it to populate meta tags so for example I'm doing something like this



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});

     })

}


Now all signs point to this should work but I don't see the updated meta tags when I view the source code and I don't see them when I check SEO tools...



Is there a solution to this?



Thanks in Advance!!






javascript angular typescript angular-universal




javascript angular typescript angular-universal






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Nov 21 '18 at 7:26

























asked Nov 21 '18 at 7:12









Smokey Dawson

1,7951039




1,7951039












  • The answers to this question might help.
    – Rolvernew
    Nov 21 '18 at 8:14




















  • The answers to this question might help.
    – Rolvernew
    Nov 21 '18 at 8:14


















The answers to this question might help.
– Rolvernew
Nov 21 '18 at 8:14






The answers to this question might help.
– Rolvernew
Nov 21 '18 at 8:14



















active

oldest

votes











Your Answer






StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});


}
});














draft saved

draft discarded


















StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53406926%2fangular-universal-update-meta-tags-with-dynamic-content%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown






























active

oldest

votes













active

oldest

votes









active

oldest

votes






active

oldest

votes
















draft saved

draft discarded




















































Thanks for contributing an answer to Stack Overflow!


  • Please be sure to answer the question. Provide details and share your research!

But avoid …



  • Asking for help, clarification, or responding to other answers.

  • Making statements based on opinion; back them up with references or personal experience.


To learn more, see our tips on writing great answers.





Some of your past answers have not been well-received, and you're in danger of being blocked from answering.


Please pay close attention to the following guidance:


  • Please be sure to answer the question. Provide details and share your research!

But avoid …



  • Asking for help, clarification, or responding to other answers.

  • Making statements based on opinion; back them up with references or personal experience.


To learn more, see our tips on writing great answers.




draft saved


draft discarded














StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53406926%2fangular-universal-update-meta-tags-with-dynamic-content%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown





















































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown

































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown







-

Popular posts from this blog

To store a contact into the json file from server.js file using a class in NodeJS

Image
0 I have created three files -contactPresentation.js, contactService.js, contacts.json. I will run the contactService.js file. And it will navigate to contactPresentation.js file that will only choose an option to either add or display a file. If add(), then add the data into add of service file.And the data will be added to the contacts.json file . And if display(), then display the display() of service file. And the display will take the data from contacts.json file. However, i know my code is flawed. Please correct it . I am also getting an error - this.contacts.push(new ContactService(userName, contactNumber, emailId)); ^ TypeError: Cannot read property 'push' of undefined at ContactService.add (e:NodeJSProjectcontactManager2contactService.js:57:23) at new C
Read more

Marschland

Image
Kilometerweite Marsch in den Vier- und Marschlanden am Elbdeich Die Wedeler Marschlandschaft in Schleswig-Holstein Der Hadelner Kanal zur Entwässerung der Marsch Die tief gelegene Marsch und ein Entwässerungskanal Das Schöpfwerk Otterndorf im Land Hadeln zur Entwässerung der Medem verfügte damals bereits über die größte Kreiselpumpe Europas. Das Schöpfwerk in Neuhaus für die Aue und des Neuhaus-Bülkauer Kanals Als Marsch(land) (v. niederdt., altsächs. mersc ) – auch Masch , Mersch oder Schwemmland genannt – bezeichnet man eine nacheiszeitlich entstandene geomorphologische Landform im Gebiet der nordwestdeutschen Küsten und Flüsse sowie vergleichbare Landformen weltweit. Inhaltsverzeichnis 1 Landschaft 2 Entstehung 3 Marschböden 4 Nutzung 5 Marschgebiete in Deutschland 6 Siehe auch 7 Literatur 8 Weblinks 9 Einzelnachweise Landschaft | Marschen sind generell flache Landstriche ohne natürliche Erhebungen. Si
Read more

Redirect URL with Chrome Remote Debugging Android Devices

Image
1 How can i redirect an URL with Chrome Remote Debugging Android Devices? like Requestly Chrome extension on desktop. google-chrome debugging url redirect testing share | improve this question edited Nov 24 '18 at 8:16 sachinjain024 14.7k 23 73 129 asked Nov 23 '18 at 16:09 Momen Momen 91 10
Read more