Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Get data from matSnackBar with openFromComponent

Hey I'm new on Angular and I want get data from matsnackbar.

Is it possible ?

    apiName: string;

    this.snackBar.openFromComponent(CustomSnackbarComponent, {
        duration: 5000000,
        data: this.apiName;
    });

My component :

export class CustomSnackBarComponent implements OnInit {
  constructor(private sanitizer: DomSanitizer) { }

  ngOnInit() {
  } 

}
like image 666
Matthis.h Avatar asked Apr 26 '18 09:04

Matthis.h


People also ask

How do you use a snack bar mat?

A snackbar can be dismissed manually by calling the dismiss method on the MatSnackBarRef returned from the call to open . Only one snackbar can ever be opened at one time. If a new snackbar is opened while a previous message is still showing, the older message will be automatically dismissed.

What is MatSnackBar?

Angular Interview Q & A series The <MatSnackBar>, an Angular Directive, is used to show a notification bar to show on mobile devices as an alternative of dialogs/popups. In this chapter, we will showcase the configuration required to show a snack bar using Angular Material.

What is snackbar service in angular?

MatSnackBar is an angular directive that's used for showing a notification bar specifically on the mobile devices. These types of UI components are generally used several times. So to avoid the repetition of code, a service can simply be created to use SnackBar in different components.


1 Answers

You have to inject MAT_SNACK_BAR_DATA in your snackbar component:

import {Component, Inject} from '@angular/core';
import {MAT_SNACK_BAR_DATA} from '@angular/material';

@Component({
  selector: 'your-snack-bar',
  template: '{{ data }}',
})
export class CustomSnackBarComponent {
  constructor(@Inject(MAT_SNACK_BAR_DATA) public data: any) { }
}
like image 188
bugs Avatar answered Oct 11 '22 12:10

bugs