8

I'm following the guide on Angular Material github to set custom global configuration to use on the snackbar module. This is the guide I'm following.

However, as sais in the docs, there is no export for MAT_SNACK_BAR_DEFAULT_OPTIONS only MAT_SNACK_BAR_DATA but it's not overriding the default configuration.

This is what I tried:

import { MatSnackBarModule, MAT_SNACK_BAR_DATA } from '@angular/material/snack-bar';

providers: [
    { provide: MAT_SNACK_BAR_DATA, useValue: { duration: 2500 } }
]

I also tried like this:

{ provide: MatSnackBarConfig, useValue: { duration: 2500 } }
{ provide: MatSnackBarConfig, useClass: SnackClass }

But none of the options is working. The snack never auto dismiss after the specified time.

celsomtrindade
  • 4,501
  • 18
  • 61
  • 116

2 Answers2

6
import { MAT_SNACK_BAR_DEFAULT_OPTIONS } from '@angular/material/snack-bar';

providers: [
  {provide: MAT_SNACK_BAR_DEFAULT_OPTIONS, useValue: {duration: 2500}}
]
Mangesh Daundkar
  • 1,026
  • 1
  • 15
  • 20
3

I believe you are messing up stuffs here

You should change duration here:

@NgModule({
  providers: [
    {provide: MAT_SNACK_BAR_DEFAULT_OPTIONS, useValue: {duration: 2500}}
  ]
})

and you must inject MAT_SNACK_BAR_DATA inside your constructor:

import {MAT_SNACK_BAR_DATA} from '@angular/material';

constructor(@Inject(MAT_SNACK_BAR_DATA) public data: any) { }
Raphael M.
  • 140
  • 6
  • But there is no export for `MAT_SNACK_BAR_DEFAULT_OPTIONS`. Where do I need to import it from? – celsomtrindade May 03 '18 at 15:24
  • You only need to import this: import {MatSnackBarModule} from '@angular/material/snack-bar'; see the documentation here: https://material.angular.io/components/snack-bar/api – Raphael M. May 03 '18 at 15:32
  • 2
    It's not a must for importing `MAT_SNACK_BAR_DATA` to the snackbar unless it's a custom snackbar component and whether you want to supply any data to the custom snackbar component. – Edric May 07 '18 at 07:27