Ng4Alert

ng4-alert provides you an alert service to convey messages. It has a simple service that can use in your Angular 4+ applications.

Installation

npm install ng4-alert

Configuration

Include ng4-alert module in your module.

import { Ng4AlertModule } from 'ng4-alert';

@NgModule({
    declarations: [
    ],
    imports: [
        Ng4AlertModule.forRoot(),
        BrowserModule
    ],
  bootstrap: []
})
export class ExampleModule { }

Try it

First of import ng4-alert service in your component where you want to use to communicate with ng4-alert API.

import { ng4AlertService } from 'ng4-alert';

Use it on Constructor of the required class

constructor(private ng4AlertService:Ng4AlertService){
}

The service provides two functions to Activate and Deactivate alert messages.

1. ng4Activate - Activate alert with options.
2. ng4Deactivate - Deactivate activated alerts.

eg:

export class AppComponent {
	title = 'MyApp';
	options = {
		text:"Success !",
		type:"fail",
		autoDismis:false,
		timeout:2000
	}
	constructor(private ng4AlertService:Ng4AlertService){}
	activate(){
		this.ng4AlertService.ng4Activate(this.options);
	}

}

you can use same for ng4Deactivate()

Deactivate(){
    this.ng4AlertService.ng4Deactivate()
}

options

functions | type | Definition ---------------------|--------| ------------- text | String | The text to be displayed in the alert, eg: Success, Fail, Send etc. Make it small to contain the alert box. type | String |The type of message. It only accepts certain string values success, fail, warning autoDismis | Boolean | The alert should dismiss automatically or not. true or false timeout | Number (in milliseconds) | If you have set autoDismis=true, then you can set time a for auto dismiss.Default is 2 seconds (2000 ms)