Primeng: Allow static HTML in the messages component

Created on 11 Jan 2017  路  7Comments  路  Source: primefaces/primeng

I'm submitting a ... (check one with "x")

[ ] bug report => Search github for a similar issue or PR before submitting
[x ] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

Current behavior
Using p-messages requires setting the severity and actual message in the controller unless i do this:

<p-messages [value]='[{"severity":"info", "detail":"your message"}]'></p-messages>

Expected behavior
Would be nice to be able to use p-messages and just including the message between the directive tags like this:

<p-messages [severity]="info">my html/content here</p-messages>

What is the motivation / use case for changing the behavior?
The use case is that simple static messages could be used where applicable instead of setting it in the controller. Also, i'm not able to insert any links in my message even if doing it via the controller

  • **PrimeNG version: 1.1.4
new feature

Most helpful comment

I also tried static html in the detail part of the object with 4.1.1 and it is not parsing the html.

All 7 comments

The growl component already does this (PR #1414), although this might not be safe (As discussed in #1356)
But it would be a very nice idea to have this functionality in both!

We can just allow html in message component.

<p-messages [value]='[{"severity":"info", "detail":"<br>your message</br>"}]'></p-messages>

It there any ETA on this added feature

@cagataycivici I tried the above code on 4.1.1, but the html is still not rendering in the message.

I also tried static html in the detail part of the object with 4.1.1 and it is not parsing the html.

<p-messages [value]='[{"severity":"info", "detail": detail}]'></p-messages>
and in TS: detail = `<a href="www.google.de" target="_blank">here is a link</a>`
works for me with primeng 6.0.0, note that it is "P-MESSAGES" and not "P-MESSAGE"...

this is not working in 10 lts branch, I get this rendered, using exactly what guntram provided above:
image

found the issue, you need to set the [escape] attribute to false

Was this page helpful?
0 / 5 - 0 ratings