Notification Module

Features

This module provides the NotificationService that helps to create user notification.

An error notification

Import

You do not need to import this module because it is imported and overridden by the Components Notification module.

Whenever you want to emit user notifications in your component, inject the NotificationsService into your component.

API usage

NotificationsService

The NotificationsService provides several methods that helps you:

• to create a user notification,
• to listen to the stream of notifications, so that your components can be notified when a new user notification arrives and reacts on that event,
• to manage the list of active notifications: to hide/show, to delete and to close them.

Emit user notification

There are four types of notifications, which are defined by the enum value NotificationType. The valid values are Success, Info, Warning and Error.

The NotificationsService provides methods to rapidly emit a notification of each of these types:

• NotificationsService.success() emits a Success notification.

The method signature is

success(
  text: string,
  params?: MapOf<any>,
  title?: string
): Notification

Example 1: success notification

this.notificationsService.success('A success message');

which yields

A success notification

• NotificationsService.info() emits an Info notification.

The method signature is

info(
  text: string,       // The message, could be internationalized (i18n) message.
  params?: MapOf<any>,// The formatting parameters for the message.
  title?: string      // The title (header) of the notification.
): Notification

Example 2: info notification

this.notificationsService.info('An info message');

which yields

An info notification

• NotificationsService.warning() emits an Warning notification.

The method signature is

warning(
  text: string,       // The message, could be internationalized (i18n) message.
  params?: MapOf<any>,// The formatting parameters for the message.
  title?: string      // The title (header) of the notification.
): Notification

Example 3: warning notification

this.notificationsService.warning('A warning message');

which yields

An info notification

• NotificationsService.error() emits an Error notification.

The method signature is

error(
  text: string,       // The message, could be internationalized (i18n) message.
  params?: MapOf<any>,// The formatting parameters for the message.
  title?: string      // The title (header) of the notification.
): Notification

Example 4: error notification

this.notificationsService.error('An error message');

which yields

An error notification

• You may notice that the notifications generated by NotificationsService.success() and NotificationsService.info() automatically disappear after a certain time while those generated by NotificationsService.warning() and NotificationsService.error() stay on the screen until you click on the close button. This is not fixed and you can can choose to make short-lived error notifications or info notification that stays on the screen until user closes it. This can be done using the method NotificationsService.success().

The method signature is

notify(
  type: NotificationType, // The notification type
  text: string,           // The message, could be internationalized (i18n) message.
  params?: MapOf<any>,    // The formatting parameters for the message.
  title?: string,         // The title (header) of the notification.
  autoClose?: boolean     // Whether the notification automatically closes after a certain time
): Notification

Example 5: custom notification

this.notificationsService.notify(NotificationType.Info, 'An info message');

which yields

A custom notification

Listen to the notification stream

The NotificationsService provides the NotificationsService.notificationsStream() for any components that want to react on the event of arrival of new notification to subscribe.

In particular, it also emits a null event when notifications are deleted.

Manage user notifications

The NotificationsService provides a variety of methods to follow and manage the state of the notification lists

• haveNotifications() returns true if there are some notifications,
• allNotificationsShowing() returns true if all the notifications in the list are being shown on the screen,
• allNotificationsShowing() returns true if none of the notifications are being shown on the screen,
• lastNotification() returns the latest notification if any,
• showNotifications() shows all the notifications in the list,
• showNotifications() hides all notifications,
• deleteAllNotifications() deletes all notifications,
• deleteNotification(notification: Notification) deletes a specific notification,
• closeNotification(notification: Notification) hides a notification if it has just been created and has not been shown, otherwise deletes the notification.