Layout Options

There are few position options available for notifications. You can click any of them to change notifications position:

Click any position

Notifications Types

Different types of notifications for lost of use cases. Custom classes are also supported.

Usage

Notifications are created with the help of ngx-toastr


import {{'{'}} ToastrService {{'}'}} from 'ngx-toastr';

@Component({{'{'}}...{{'}'}})
  export class YourComponent {{'{'}}
  constructor(private toastr: ToastrService) {{'{'}}{{'}'}}

  showSuccess() {{'{'}}
    this.toastr.success(
      'Hello world!', 'Toastr fun!'
    );
  {{'}'}}
{{'}'}}

For more API information refer to the library documentation

Notification Types Examples

Thanks for Checking out Messenger

announcement

New user feedback received

account_box

New customer is registered

done

The order was shipped

business_center

The order was delivered

info

5 Defence alerts

Notification Types Examples

report

New report has been received

announcement

New user feedback received

done

The item was shipped

The new message from user @nahawaii

get_app

Your file is ready to upload

disc_full

The disc is full

Notification Types Examples

report

New report has been received

announcement

New user feedback received

done

The item was shipped

The new message from user @nahawaii

get_app

Your file is ready to upload

disc_full

The disc is full