Question posted in 
I am using prerender.io to render angular 6 pages using headless chrome. The problem is that the renderer does not render the router links and the link information gets lost.
This is especially problematic, given that the purpose of rendering is SEO.
For example, a button with [routerLink]=”previewLink”, will be rendered to a button with no router link.
Here is a live example
rendered page with no links
https://prerender.io/raw-html?url=https%3A%2F%2Fwww.fiveabook.com%2Fbooks&adaptiveType=desktop
No href and no router link in the “Preview” buttons:
<button _ngcontent-c12="" color="accent" mat-button="" tabindex="0" class="mat-button mat-accent ng-star-inserted"><span class="mat-button-wrapper">
angular page with router links
https://www.fiveabook.com/books
The buttons have dynamically generated router links.
- Initiallly, the question was in regards to href links. However, the buttons don’t have href links. Nevertheless, the rendered does not render the router links in the Preview buttons so I am not sure if googlebot can see where the buttons link to.
2
Answers
If I load https://www.fiveabook.com/books directly in my Chrome browser on my Mac and look for that button, I’m not seeing an href there either:
So it looks like we are rendering the page exactly as a normal Chrome browser is rendering it.
Html buttons dont have a href attribute. Simply use an anchor element if you want to generate a hyperlink button.