{"id":15474784,"url":"https://github.com/adityasingh-bot/angular-notify-toaster-demo","last_synced_at":"2026-04-28T20:32:21.133Z","repository":{"id":222545069,"uuid":"757703434","full_name":"adityasingh-bot/angular-notify-toaster-demo","owner":"adityasingh-bot","description":"Angular Notification Toaster Module (notify-toaster) Demo App","archived":false,"fork":false,"pushed_at":"2024-02-14T20:06:28.000Z","size":122,"stargazers_count":1,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-09-19T17:47:06.675Z","etag":null,"topics":["angular-cli","component-library","npm-module"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/adityasingh-bot.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2024-02-14T20:00:37.000Z","updated_at":"2024-08-30T08:20:45.000Z","dependencies_parsed_at":"2024-02-14T21:27:00.941Z","dependency_job_id":"ec49a5eb-aa9a-483a-aa7b-2c974953fb46","html_url":"https://github.com/adityasingh-bot/angular-notify-toaster-demo","commit_stats":null,"previous_names":["adityasingh-bot/angular-notify-toaster-demo"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/adityasingh-bot/angular-notify-toaster-demo","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adityasingh-bot%2Fangular-notify-toaster-demo","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adityasingh-bot%2Fangular-notify-toaster-demo/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adityasingh-bot%2Fangular-notify-toaster-demo/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adityasingh-bot%2Fangular-notify-toaster-demo/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/adityasingh-bot","download_url":"https://codeload.github.com/adityasingh-bot/angular-notify-toaster-demo/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adityasingh-bot%2Fangular-notify-toaster-demo/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32398513,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-28T19:38:08.556Z","status":"ssl_error","status_checked_at":"2026-04-28T19:37:55.688Z","response_time":56,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular-cli","component-library","npm-module"],"created_at":"2024-10-02T03:04:17.509Z","updated_at":"2026-04-28T20:32:21.100Z","avatar_url":"https://github.com/adityasingh-bot.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Notify\n\nThis library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.1.0.\n\nAngular Notification Toaster Module (notify-toaster)\n==============================================\n\nThe library provides a notification which is written in Angular and it is dependent on native angular\n\n## Guide:\n\n 1. Install the notify-toaster using npm\n    `npm install notify-toaster`\n   - **Note** : Use the regular npm flags such as \n         - `--save` to include under dependencies in `package.json`.\n         - `-g` to install it globally\n         \n*************************\n\n 2. Add `NotifyModule` to AppModule by importing it from `notify-toaster` package \n```\n    import { NotifyModule } from 'notify-toaster';\n    \n    @NgModule({\n      imports: [NotifyModule],\n      ...\n    })\n    export class AppModule {\n    }\n```\n*************************\n\n 3. As this library uses Angular animations. `BrowserAnimationsModule` should also be imported to the `app.module`. \n - **Note** : Further exploration of `@angular/animations` module can be referred [**here**](https://angular.io/guide/animations#animations), official documentation.\n \n ```\n    import { BrowserAnimationsModule } from '@angular/platform-browser/animations';\n\n    @NgModule({\n      imports: [BrowserAnimationsModule],\n      ...\n    })\n    export class AppModule {\n    }\n```\n \n     \n*************************\n\n  4. **Create a placeholder** for the `app-notify-container` componenet in your `app.component.html`\n```\n    \u003capp-notify-container\u003e\u003c/app-notify-container\u003e\n```\n\n*************************\n\n  5. Inject the **NotifyService** into your component\n```\n    constructor(private notifyService: NotifyService) { }\n```\n\n*************************\n\n  6. The **toast message configuration** contains following properties\u003cbr/\u003e\n\n|**Property**    | **Data Type** |  **Mandatory**   |   **Default Value**     |               **Usage**                            |\n| ------------   |  ----------   |  --------------  |  ---------------------  |  ----------------------------------------------    |\n| id              |   string      |       No         |   ----------            |  Auto generated for each notification             |\n| message         |   string      |       Yes        |   ----------            |  The user defined toast message                   |\n| autoHide        |   boolean     |       No         |     true                |  This will hide the message                       |\n| displayDuration |   number      |       No         |     5000(milli seconds) |  Timeout Duration can be set using this property  |\n| showCloseButton |   boolean     |       No         |     true                |  Close button can be seen for manually closing it |\n| toastType       |   ToastType   |       Yes        |   ----------            |  Type of the toast message can be set htere       |\n\n- where `ToastType` is a enumeration type that determines the type of the notification which takes a five values viz.,\n    * success\n    * update\n    * warning\n    * info\n    * delete\n\n*************************\n\n7. To **show the toast message** you should be calling the `show()` method that takes only two argument, type of notification and messsage\n  ```\n  pushSuccess() {\n    this.notification.show('success', 'This is a success alert');\n  }\n  ```\n*************************\n\n8. To **manually close** a particular toast message set the `autoHide` property as `false` and `showCloseButton` property as `true` which displays a close button using which the message can be manually closed.\n\n*************************\n\n\n*************************\n\n9. To show **multiple notification** messages you can call the `show()` multiple times by configuring the notification object as you wish\n  ```\n  pushSuccess() {\n    this.notification.show('success', 'This is a success notification');\n  }\n  pushUpdate() {\n    this.notification.show('update', 'This is a update notification');\n  }\n  pushWarn() {\n    this.notification.show('warning', 'This is a warning notification');\n  }\n  pushInfo() {\n    this.notification.show('info', 'This is a info notification');\n  }\n  pushDelete() {\n    this.notification.show('delete', 'This is a delete notification');\n  }\n  ```\n  \nFor LIVE DEMO checkout on https://notify-toaster.netlify.app/\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fadityasingh-bot%2Fangular-notify-toaster-demo","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fadityasingh-bot%2Fangular-notify-toaster-demo","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fadityasingh-bot%2Fangular-notify-toaster-demo/lists"}