# @anglr/notifications

> Angular module for displaying notifications

Latest version **12.0.2** (published 2026-05-04) · MIT license · 0 weekly downloads

## Install

```sh
npm install @anglr/notifications
pnpm add @anglr/notifications
yarn add @anglr/notifications
bun add @anglr/notifications
```

## Health

**Score 55/100 (C)** — status: active.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 12.0.2 |
| Published | 2026-05-04 |
| First published | 2020-01-08 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM |
| Node | ^20.19.0 \|\| ^22.12.0 \|\| >=24.0.0 |
| Dependencies | 6 |
| Unpacked size | 138.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | kukjevov |
| Maintainers | kukjevov, vinckobb |
| Keywords | angular, ng, notifications |

## Links

- npm: https://www.npmjs.com/package/@anglr/notifications
- Repository: https://github.com/ressurectit/ng-notifications
- Issues: https://github.com/ressurectit/ng-notifications/issues
- npm.io page: https://npm.io/package/@anglr/notifications

## Dependencies (6)

- [rxjs](https://npm.io/package/rxjs.md) >=7.5.7
- [tslib](https://npm.io/package/tslib.md) ^2.8.1
- [@anglr/common](https://npm.io/package/@anglr/common.md) >=22.0.0
- [@angular/core](https://npm.io/package/@angular/core.md) >=20.3.2
- [@jscrpt/common](https://npm.io/package/@jscrpt/common.md) >=7.0.0
- [@angular/common](https://npm.io/package/@angular/common.md) >=20.3.2

## Alternatives

- [angular-pipes](https://npm.io/package/angular-pipes.md) — 5.6K weekly downloads
- [@ng-web-apis/midi](https://npm.io/package/@ng-web-apis/midi.md) — 2.6K weekly downloads
- [happn-3](https://npm.io/package/happn-3.md) — 1.6K weekly downloads
- [@opensip-cli/lang-go](https://npm.io/package/@opensip-cli/lang-go.md) — 1.2K weekly downloads
- [mongoose-typescript](https://npm.io/package/mongoose-typescript.md) — 85 weekly downloads

## Recent versions

- 12.0.2 (latest) — 2026-05-04
- 12.0.2-beta.20260504084250 (next) — 2026-05-04
- 12.0.1 — 2025-11-25
- 12.0.1-beta.20251125073620 — 2025-11-25
- 12.0.0 — 2025-09-29
- 12.0.0-beta.20250929053234 — 2025-09-29
- 12.0.0-beta.20250825085537 — 2025-08-25
- 12.0.0-beta.20250825084356 — 2025-08-25
- 11.0.1-beta.20250127104758 — 2025-01-27
- 11.0.0 — 2025-01-27
- 11.0.0-beta.20250127103117 — 2025-01-27
- 11.0.0-beta.20250127082215 — 2025-01-27
- 10.0.0 — 2023-08-18
- 10.0.0-beta.20230818114058 — 2023-08-18
- 10.0.0-beta.20230818113507 — 2023-08-18
- … 21 more at https://npm.io/package/@anglr/notifications/versions

## README

[![npm version](https://badge.fury.io/js/%40anglr%2Fnotifications.svg)](https://badge.fury.io/js/%40anglr%2Fnotifications)
[![Build status](https://ci.appveyor.com/api/projects/status/lvu50fvpiyqrenmf?svg=true)](https://ci.appveyor.com/project/kukjevov/ng-notifications)

# Angular Notifications

Angular module for displaying notifications.

Module contains components for displaying local and global notifications.

* [Installation](#installation)
* [Types](#types)
* [Usage](#usage)
* [API](#api)
* [Change Log](./changelog.md)

## Installation

To install latest version of this module you just run:

```bash
npm install "@ng2/notifications" --save
```

### SystemJs Usage

In your **SystemJs** configuration script add following lines to `packages` configuration section:

```javascript
packages:
{
    '@ng2/notifications': 
    {
        main: "dist/index.dev.min.js",
        defaultExtension: 'js'
    }
}
```

### Webpack Usage

In your application create file called *dependencies.ts* and add following line:
```typescript
import '@ng2/notifications';
```

Then add this file as `entry` point in your *webpack.config.js*:
```javascript
"vendor-import": path.join(__dirname, "pathToVendorTsDirectory/vendor.ts")
```

Then reference this file in your *index.html* at the end of body before application start javascript:
```html
<script src="webpackOutputDirectory/vendor-import.js"></script>
```

## Types

Available types:

### Modules

 - `NotificationsModule`

### Components

- `Notifications`
- `GlobalNotifications`
- `NotificationMessage`

### Interfaces, classes, enums

- `Notification`
- `NotificationType`
- `NotificationsOptions`

### Services

- `GlobalNotificationsService`
- `LocalNotificationsService`

## Usage
### Import Module
#### Typescript

This enables usage of all 'Notifications' components.

```typescript
import {NgModule} from '@angular/core';
import {NotificationsModule, GlobalNotificationsService} from '@ng2/notifications';
import {GlobalSampleComponent} from '.globalSample.component';
import {LocalSampleComponent} from '.localSample.component';

/**
 * Definition of your module
 */
@NgModule(
{
    imports: [NotificationsModule],
    declarations: [GlobalSampleComponent, LocalSampleComponent],
    providers: [GlobalNotificationsService]
})
export class YourModule
{
}
```

---
_Source: https://npm.io/package/@anglr/notifications · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
