How to inject snackBarRef into a component with openFromComponent
Improving on Dario's answer,
If one wants to capture the action button click in the calling component, one should use
snackBarRef.dismissWithAction()
in (click) event.
<button mat-raised-button color="accent" (click)="snackBarRef.dismissWithAction()">{{ data.action }}</button>
I was stuck on the same problem today, but found the solution:
import { Component, Inject } from '@angular/core';
import { MAT_SNACK_BAR_DATA, MatSnackBarRef } from '@angular/material';
@Component({
selector: 'my-notification',
template: `
<p>{{ data.message }}</p>
<button mat-raised-button
color="accent"
(click)="snackBarRef.dismiss()">{{ data.action }}</button>
`,
})
export class TestNotificationComponent {
constructor(
public snackBarRef: MatSnackBarRef<TestNotificationComponent>,
@Inject(MAT_SNACK_BAR_DATA) public data: any,
) {}
}
Angular will handle injecting the snackBarRef.