En angular 2, ¿cómo puedo hacer que la etiqueta canónica sea dinámica por página?
Esta es mi etiqueta de página de índice para ello:
<link rel="canonical" href="https://mywebsite.co.uk" />¿Cómo puedo hacerlo dinámico, por ejemplo, si en la página del blog debería verse así en tiempo de ejecución?
<link rel="canonical" href="https://mywebsite.co.uk/blog" />Estoy usando la versión angular 4, webpack y mecanografiado con ng2-metadata para cambiar el título, la descripción y las palabras clave de todas mis direcciones URL.
Solo necesito que la etiqueta canonical cambie para el bot de Google SEO.
Implementé un servicio que se llama en las funciones ngOnInit de los componentes de mi página:
import { Inject, Injectable } from '@angular/core'; import { DOCUMENT } from '@angular/common'; @Injectable() export class LinkService { private link: HTMLLinkElement; constructor(@Inject(DOCUMENT) private doc) { } createLinkForCanonicalURL() { if (this.link === undefined) { this.link = this.doc.createElement('link'); this.link.setAttribute('rel', 'canonical'); this.doc.head.appendChild(this.link); } this.link.setAttribute('href', this.doc.URL.split('?')[0]); } }Fuente: https://www.concretepage.com/angular/angular-title-service-and-canonical-url