snack-bar

[JoseRFJuniorLLMs]

I'm trying to extend a notification system using a snack bar on your project, but without success, do you have any tips?

import { MatExpansionModule } from '@angular/material/expansion'; import { MatSnackBarModule } from '@angular/material/snack-bar';

openSnackBar() { this.snackBar.openFromComponent(AppComponent, { duration: 900, }); }

<button mat-button (click)="openSnackBar()" aria-label="Show an example snack-bar"> Button </button>

[tomastrajan]

Hmm may look into it, haven't really used material snackbar before, I guess it can have something to do with the layout and being all wraped in side menu wrapper ?

[Fiontan]

@DevJoseWeb please provide more code- e.g. it's not obvious from above if you are correctly injecting MdSnackBar instance into your component and I'm not so sure about the AppComponent part of: this.snackBar.openFromComponent(AppComponent ...

[Fiontan]

@DevJoseWeb I don't have time to clone/fork/pull request etc but here is a solution- it's the src dir zipped and contains a shared-snack component added to the shared module as an entryComponent.
I then import it and the MatSnackbar into the todos.component:
import { MatSnackBar } from '@angular/material';
import { SharedSnackComponent } from '@app/shared/shared-snack/shared-snack.component';

I then inject the snackbar ref into the constructor:
constructor(public snackBar: MatSnackBar, public store: Store) {}
I then add the following method:
openSnackBar() {
this.snackBar.openFromComponent(SharedSnackComponent, {
duration: 500,
});
}

which gets called from:
onAddTodo() {
this.store.dispatch(new ActionTodosAdd({ name: this.newTodo }));
this.newTodo = '';
this.openSnackBar();
}
This opens a snackbar with the component:

In some projects I have worked on with ngrx, we have a layout slice in the store and the open/close snackbar are actions on the store but that's a different story...
here is the src zip
src.zip

[tomastrajan]

Ok, so I added snack-bar notification to todos example, feel free to check it!

That being said, I personally find snack-bar pretty lacking compared to full-fledged notification system with stuff like severity etc... I might add centralized notification service later...