NgxNotificationMsg

Angular Library to display notification message.

Demo

• A simple usage example can be found under src/app directory of this repository.

• You may also visit the online usage example on https://maormoshe.github.io/NotificationMsgLibrary/

Installation

1. Download from npm

npm install ngx-notification-msg --save

2. Import the NgxNotificationMsgModule module

import {NgxNotificationMsgModule} from 'ngx-notification-msg'

3. Add NgxNotificationMsgModule to your module imports

 @NgModule({ ... imports: [ ... NgxNotificationMsgModule ] })

4. Import the NgxNotificationMsgService service in any angular component

import {NgxNotificationMsgService} from 'ngx-notification-msg'

5. Inject the NgxNotificationMsgService service in the angular component's constructor

 constructor(private readonly ngxNotificationMsgService: NgxNotificationMsgService) {
 
 }

6. Now you can use ngxNotificationMsgService service

 this.ngxNotificationMsgService.open({
    status: NgxNotificationStatusMsg.SUCCESS,
    header: 'Hey',
    messages: ['How are you today ?!']
 });

API

Use the NgxNotificationMsgService service in any angular component you like.

Methods

open(inputsConfig: INgxNotificationMsgConfig, element?: Element): void

Enums & Interfaces

export enum NgxNotificationStatusMsg {
    SUCCESS = 'SUCCESS',
    FAILURE = 'FAILURE',
    INFO = 'INFO',
    NONE = 'NONE'
}

export enum NgxNotificationDirection {
    TOP = 'TOP',
    TOP_RIGHT = 'TOP_RIGHT',
    TOP_LEFT = 'TOP_LEFT',
    BOTTOM = 'BOTTOM',
    BOTTOM_RIGHT = 'BOTTOM_RIGHT',
    BOTTOM_LEFT = 'BOTTOM_LEFT'
}

interface INgxNotificationMsgConfig {
    status?: NgxNotificationStatusMsg;
    direction?: NgxNotificationDirection;
    header?: string;
    messages: string[];
    color?: string;
    delay?: number;
    displayIcon?: boolean;
    displayProgressBar?: boolean;
    closeable?: boolean;
}

Notes

• Multiple directions can't live at the same time.