Template or HTML in Toast


Topic: Template or HTML in Toast

MikeOnline pro priority asked a year ago

I am trying to use a Toast / Notification with a custom message using HTML, the Angular docs (https://mdbootstrap.com/docs/angular/advanced/notifications/#docsTabsAPI) for notations list an option of "enableHtml" but how does this work? and is this the right option to allow custom html in the toast/notification message?

Can it be done?


Konrad Stępień staff answered a year ago

Hi @MikeOnline,

Yes, you can provide HTML like this:

HTML

<a mdbBtn color="info" class="waves-light" (click)="showInfo()" mdbWavesEffect>Info message</a>

TS

showInfo() {
  this.toastrService.info('<b>Success</b> message', '', { enableHtml: true });
}

But remember, this option is "unsafe" because you can provide too many elements along with styles which can spoil the notification view


Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 9.3.1
  • Device: Laptop
  • Browser: *ium
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: Yes