angular-notifier
angular-notifier copied to clipboard
Not working with angular 6.1
I've followed the setup and I do not see any notification
Could you provide more details, perhaps even a Plunkr / StackBlitz?
I am working on my localhost, I followed the steps needed during installation and I do not see any notification
I am ready to provide any information you need
A reproduction of the issue would be best. There is a StackBlitz example in the README that works, have you looked into that?
It doesn't work for me as well will provide info during the weekend!
I am on Typescript ^2.9.2 and Angular ^6.1.2 and it works for me.
Not seeing any notifications either. However, repeatedly clicking on any <a routerLink="/somepage">...</a> makes one notification appear at a time. Once a notification appeared, one can also click beside it to have another appear, etc.
"@angular/core": "^6.1.2", // upgraded from "^6.1.0"
"angular-notifier": "^4.1.1",
"typescript": "~2.9.2"
Update: injecting app: ApplicationRef from '@angular/core' and calling notifier.notify(...); app.tick() will display the notification for me.
Notifications appear for me, but styles are missing. I've tried importing both CSS and SCSS files directly into angular.json and styles.scss. Notification appears as below:

Tested with Angular 6.1
` // Scss import @import "~angular-notifier/styles/core.scss";
// Angular.json styles "styles": [ "node_modules/bootstrap/dist/css/bootstrap.min.css", "src/styles.scss" ], `
If you import the styles separately, you need at least three imports: core, a theme, and types. Or, import everything by just importing "styles.scss" (without the "core" in the name.
Check out the README, it's described in detail there :)
I am experiencing the same thing as @robertkoehler and can confirm that injecting an ApplicationRef and running the tick-method after calling the notify-method on the notifier makes the notification show up instantly. There seems to be some sort of problem with the call to the notify-method not being picked up by Angulars change detection.
Works as default in Angular 7 (importing styles into general css, not into angular.json). However custom styles don't work. Even the example given is incorrect (please check). Main reason need custom style is default given is not responsive at all.
Using template etc, and wrapping it. calling it with ViewChild, does not show any dialog.
Ref SzabKel commented on Sep 18, 2018 I am on Typescript ^2.9.2 and Angular ^6.1.2 and it works for me.
yes it's work for me too.
I had to add them in angular.json under styles to work. The @import did not worked.
I'm using angular 6.13 and TypeScript 2.7.2
I had to add them in angular.json under styles to work. The
@importdid not worked. I'm using angular 6.13 and TypeScript 2.7.2
did it worked?
I am using webpack instead of angular-cli. I also had the same issue, that the styles were not working with angular-notifier. What I did was I just added the following to my index.html file.
<link href="./node_modules/angular-notifier/styles.css" rel="stylesheet"/>
Then it was working properly.
(Angular-notifier need to be installed using npm install before including this)
I had to manually copy and paste the whole content of each and every scss file into my scss file and wrap everything on a ::ng-deep {} that made the trick
I am having the same issue on Angular 7. Did the same what you've told but didn.t work @vandhanamprasad. @rp0m did you find any solution.
I've just released angular-notifier versions for Angular 7 and Angular 8. Does still issue still exist? If so, can anyone affected create a reproduction?
Invested full day trying to make notification work for "@angular/core": "^6.1.10", but to no avail. No error either. Just that the notification would not appear. Tried all versions ^4.*. Cannot re-produce the error on stackblitz. Exhausted all tips in this thread. Just in case if there is something that I can try, please let me know.
I had the same problem of rp0m and was the wrong css import . my way (wrong) : @import "~angular-notifier/styles/core.scss"; The correct way: @import "~angular-notifier/styles"; in the file styles.css or styles.scss of the angular project. Thats all. @dominique-mueller I had to run stackblitz to understand this and what says in README.
same problem with angular 9, no styles are loading using @import 'angular-notifier/styles.scss'
using @import '~angular-notifier/styles.scss' cannot be comiled -> file not found
Styling-related issues might have been fixed with https://github.com/dominique-mueller/angular-notifier/pull/186, released with 6.0.2 and all later versions. Feel free to check if it works without any workarounds :)