ngx-notification

Angular Library to show all types of notifications in a Toast Notification format. It is very simple to setup and can be used for all types of notifications you want to show.
Parameters are: ``Message, Theme and Position.``
You can also use your own custom css by setting the Theme parameter to 'none'.
Tested on Angular 6+

npm install ngx-notification --save

Step 1: (After Installing)
Add the Notification Component to your app.module.ts

import { NgxNotificationComponent } from 'ngx-notification';

and add:

NgxNotificationComponent

to the declarations part of the module.
You app.module might look like this:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';

import { NgxNotificationComponent } from 'ngx-notification';

@NgModule({
  declarations: [
    AppComponent,
    NgxNotificationComponent
  ],
  imports: [
    BrowserModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

STEP 2: (Add the Service to you component(s) where you want to display the Notifications)
In this case we are going to display notifications in the app.component.html
app.component.ts (Here is an example:)

import { Component } from '@angular/core';
import { NgxNotificationService } from 'ngx-notification';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  constructor(private ngxNotificationService: NgxNotificationService) {}

  sendNotification() {
  	this.ngxNotificationService.sendMessage('This is my message to you!', 'dark', 'bottom-right');
  }

}

STEP 3:
All we need to do is to add:

<lib-ngx-notification></lib-ngx-notification>

to the app.component.html page.
In this example we are going to add a button click to show the Notification so the app.component.html page would look like this:

<button (click)="sendNotification()">Click here to test message</button> <br><br>

<lib-ngx-notification></lib-ngx-notification>

And that is all!

PARAMETERS / OPTIONS

The notifications are send like this:
``this.ngxNotificationService.sendMessage('This is my message to you!', 'dark', 'bottom-right');``
-- The first parameter is the Message which is a String.
-- The second parameter is the Theme.

• Options available are:

``dark, light, success, info, warning, danger and none.``
If you use 'none' you can then add you own css to it by targetting class: ngx-notification
So, an example to add your own custom colors would be:
``` .ngx-notification {

background-color: #2d2d30;
border-color: #272729;
color: #c9c9c9;

} ```
You would just add your own colors.
-- The last parameter is the position where you want the Notification to appear.
- Options are:

```top-left, top-right, bottom-left, bottom-right and center```

Author

Steven Fernandez

License

This project is licensed under the MIT License - see the LICENSE.md file for details

0.0.1 - 2018-05-12

Added

• First Commit

1.0.0 - 2018-05-19

Added

• Updated Instructions on README

1.0.1 - 2018-05-19

Added

• Updated Instructions on README and Keywords

1.0.2 - 2018-05-19

Added

• Updated README - Cleaned Formatting

1.0.3 - 2018-05-19

Fixed

• Updated README - Spelling Fixed

1.0.4 - 2018-05-19

Added

• Updated - Package.json

1.0.5 - 2018-05-19

Added

• Updated - Package.json