He estado tratando de aplicar este código para resaltar los hipervínculos en el contenido que se obtiene de una base de datos a través de una API. El código funciona para aplicar el resaltado de hipervínculos en la parte "Descripción", pero el mismo código no resalta los hipervínculos para la sección "Notas".

Aquí está el código:

 import { AfterViewInit, Component, Inject, OnInit } from '@angular/core'; import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; @Component({ selector: 'app-variable-notes-dialog', templateUrl: './variable-notes-dialog.component.html', styleUrls: ['./variable-notes-dialog.component.scss'] }) export class VariableNotesDialogComponent implements OnInit, AfterViewInit { variableNotes; pageTitle: string; constructor(@Inject(MAT_DIALOG_DATA) public data: any, public dialogRef: MatDialogRef<VariableNotesDialogComponent>) { if(data) { this.variableNotes = data.variableNotes; this.pageTitle = data.pageTitle; } } ngOnInit(): void { } ngAfterViewInit(): void { const notes = document.getElementById('notes'); const description = document.getElementById('description') // notes.innerHTML = this.variableNotes.notes? this.variableNotes.notes: '--'; this.variableNotes.notes ? notes.getElementsByTagName('p')[0].innerHTML = this.variableNotes.notes : notes.classList.add('hidden') description.innerHTML = this.variableNotes.description? this.variableNotes.description : '--'; description.childNodes?.forEach(node => { if (node instanceof HTMLAnchorElement) { node.classList.add('font-bold', 'text-red-600') } }) notes.childNodes?.forEach(node => { if (node instanceof HTMLAnchorElement) { node.classList.add('font-bold', 'text-red-600') } }) } onClose() { this.dialogRef.close(); } }

Aquí está el resultado, el problema es que el hipervínculo "aquí" no está resaltado en las notas, mientras que la descripción del hipervínculo está resaltada con el código anterior: