I am working with an object that contains success, summary, and detail elements, which are used to display messages in PrimeNG message component (p-messages) after a record is created. Once the record is created, I invoke the displayMessage method to set the msg variable.
form.ts:
...
this.displayMessage(data);
baseForm.ts:
displayMessage(data: string) {
var success = data["success"];
var summary = data["summary"];
var detail = data["detail"]; // <a href="http:/.... ">name</a>
this.msg.push({ success: success, summary: summary, detail: detail });
}
Then, I display the message in the html as shown below:
<p-messages [value]="msg"></p-messages>
However, I noticed that the hyperlink tag “<a” is changed to “<a” and I believe I need to sanitize the URL. I attempted to follow a solution described on Angular 6 sanitize local drive URL, but I faced difficulties because the method to sanitize the URL is in the base class and the URL that needs to be sanitized is in the detail variable. How can I ensure that the URL displays correctly in this scenario? What modifications are needed in the provided example?