If you have both stored seperately you can escape the value in USERCOMPANY using (quick and dirty):
USERCOMPANYstring.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """).replace(/'/g, "'");
Include your escaped usercompany string into your other html code using some kind of replacement and then put that in your html using a safe pipe:
<p [innerHTML]="yourVariable | safe: html"></p>
Safe Pipe:
import { Pipe, PipeTransform } from "@angular/core";
import {
DomSanitizer,
SafeHtml,
SafeStyle,
SafeScript,
SafeUrl,
SafeResourceUrl
} from "@angular/platform-browser";
@Pipe({
name: "safe"
})
export class SafePipe implements PipeTransform {
constructor(protected sanitizer: DomSanitizer) {}
public transform(
value: any,
type: string
): SafeHtml | SafeStyle | SafeScript | SafeUrl | SafeResourceUrl {
switch (type) {
case "html":
return this.sanitizer.bypassSecurityTrustHtml(value);
case "style":
return this.sanitizer.bypassSecurityTrustStyle(value);
case "script":
return this.sanitizer.bypassSecurityTrustScript(value);
case "url":
return this.sanitizer.bypassSecurityTrustUrl(value);
case "resourceUrl":
return this.sanitizer.bypassSecurityTrustResourceUrl(value);
default:
throw new Error(`Invalid safe type specified: ${type}`);
}
}
}
This will sanitize your input coming from the database and the escaped characters (i.e. USERCOMPANY) shouldn't appear as html, but the rest would be normal html and trusted by Angular since you sanitized it.