regex - Hur söker och ersätter man från en SafeHtml-variabel i Angular?

Jag har en mycket enkel fråga. Jag har en sanerad sträng och dess typ i Angular är SafeHtml.

Vad skulle vara det bästa sättet att söka och ersätta viss HTML i denna SafeHtml-variabel?

...

const sanitzedHtml: SafeHtml = this.sanitizer.bypassSecurityTrustHtml(changes.pureHtml.currentValue);

...

Mitt mål är att ersätta vissa strängar med lite extra HTML-kod, så det bästa skulle vara att kunna söka bara inom HTML-noderna, inte överallt i koden.

Finns det ett snabbare sätt än att omvandla SafeHtml-variabeln till en sträng igen och använda en grundläggande replace med ett RegExp?

Tack

Svar #1

Ändra HTML-koden innan du sanerar

1 - Att använda regex

Du kan ändra din kod genom att använda Regex på din html-sträng och sedan sanera den.

let html = "<div>myHtml</div>"
const regex = /myRegexPattern/i;
html.replace(regex, 'Replacement html part'));

2 - Använda DocumentFragment

Du kan också skapa ett fragment av din html, ändra det du vill i det och sätta ihop det innan du startar din saneringsfunktion

let str:string = "<div id='test'>myHtml</div>";
const sanitzedHtml:SafeHtml = this.sanitizer.bypassSecurityTrustHtml(changeMyHtml(str));

function changeMyHtml(htmlString:string):string{
    let fragment= document.createRange().createContextualFragment(str);
    //do what you need to do here like for exemple
    fragment.getElementById('test').innerHtml = "myHtmlTest";
    //then return a string of the modified html
    const serializer = new XMLSerializer();
    return serializer.serializeToString(element)
}