https://github.com/BenevidesLecontes/ngx-bootstrap-alert-notification

Angular bootstrap alerts as notifications
https://github.com/BenevidesLecontes/ngx-bootstrap-alert-notification

alert angular angular10 angular8 angular9 bootstrap bootstrap4 notification notifications

Last synced: about 2 months ago
JSON representation

Angular bootstrap alerts as notifications

• Host: GitHub
• URL: https://github.com/BenevidesLecontes/ngx-bootstrap-alert-notification
• Owner: BenevidesLecontes
• Created: 2019-07-06T19:58:59.000Z (almost 5 years ago)
• Default Branch: master
• Last Pushed: 2023-01-06T02:00:53.000Z (over 1 year ago)
• Last Synced: 2024-04-05T11:21:57.977Z (3 months ago)
• Topics: alert, angular, angular10, angular8, angular9, bootstrap, bootstrap4, notification, notifications
• Language: TypeScript
• Homepage: https://benevideslecontes.github.io/ngx-bootstrap-alert-notification/
• Size: 5.63 MB
• Stars: 11
• Watchers: 2
• Forks: 2
• Open Issues: 27
• Metadata Files:
  • Readme: README.md

Lists

• awesome-angular-components - BenevidesLecontes/ngx-bootstrap-alert-notification - Angular bootstrap alerts as notifications (UI Components / Notification)

README

        
**Every feedback is welcome!**

[Demo](https://benevideslecontes.github.io/ngx-bootstrap-alert-notification/)

## Installation

Install via npm:

```shell

$ npm install @benevideschissanga/ngx-bootstrap-alert-notification --save

```

or yarn:

```shell

$ yarn add @benevideschissanga/ngx-bootstrap-alert-notification

```

## Usage

To use ngx-bootstrap-alert-notification

In your main module, import `NgxBootstrapAlertNotificationModule.forRoot()`

In your component inject the `NgxBootstrapAlertNotificationService` and use like:

```typescript

this.notificationService.show(

  {

    type: 'danger',

    message:

      'This is a notification with close button and icon and can have many lines.',

    icon: 'icon icon-bell-55',

    title: 'Danger',

  },

  {

    position: 'topRight',

  }

)

```

### NotificationData

| Property Name | Property Type    | Property Value                                    |

| ------------- | ---------------- | ------------------------------------------------- |

| type          | NotificationType | `warning`, `success`, `primary`, `info`, `danger` |

| title         | string           | Title for the alert                               |

| icon          | string           | Icon class name                                   |

| message       | string           | Message to display                                |

| template      | TemplateRef | Custom template                                   |

### NotificationConfig

You can pass custom configs

| Property Name | Property Type | Property Value                                                                  |

| ------------- | ------------- | ------------------------------------------------------------------------------- |

| position      | string        | `topLeft`, `topCenter`, `topRight`, `bottomLeft`, `bottomCenter`, `bottomRight` |

| animation     | boolean       | Should be animated or not                                                       |

| timeOut       | number        | Delay time to auto close the alert                                              |

| dismissible   | boolean       | Should auto close or not                                                        |

| unique        | boolean       | Dont show duplicated messages if true                                           |

## Versions

`0.0.3 - Angular 8`

`0.0.4 - Angular 9`

`0.0.5 - Angular 10`