Similar to Message components, Growl is used to display Messages as a result of specific actions, but it displays in the form of the Overlay mode instead of the inline mode. Each Message is represented through the Message interface with severity, summary, and details. A basic example of Growl to notify the user would be as follows:
<p-growl ([value])="messages" name="basic"></p-growl>
The value property defines an array of the Message interfaces in the backing component model. The component will be rendered as shown in the following screenshot:
Similar to the Messages component, the same severity types can be defined in Growl as well. PrimeNG 4.1 release introduced the onClick event callback which will be invoked when a Message is clicked on.