Question

我使用Material SnackBar来显示消息，并为SnackBar提供了一个额外的组件。在该组件中，我想根据数据/消息动态更改panelClass的值，并且不想每次都在openFromComponent方法的panelClass参数中传递。

有没有办法做到这一点？我在文档中找不到任何内容。在以下代码中，您可以看到我的SnackBar组件TS。

export class SnackbarComponent implements OnInit {
  constructor(public snackBarRef: MatSnackBarRef<SnackbarComponent>,
              @Inject(MAT_SNACK_BAR_DATA) public data: any,
              @Inject(MAT_SNACK_BAR_DEFAULT_OPTIONS) public options: any) { }
}

我正在将我的SnackBar组件用于：

this._snackBar.openFromComponent(FewoSysSnackbarComponent, {
          data: {type: 'success/warn/info/error', text: 'MESSAGE'}
        });

Answer 1

我找到了一个解决方案并实现了使用SnackBar组件的服务，这里是我的代码：

import { Injectable } from '@angular/core';
import {MatSnackBar} from '@angular/material';
import {SnackbarComponent} from '../module/shared/snackbar/snackbar.component';

@Injectable({
  providedIn: 'root'
})
export class SnackBarService {

  constructor(public snackBar: MatSnackBar) {}

  show(message: string, type?: string, duration?: any) {
    this.snackBar.openFromComponent(SnackbarComponent, {
      data: {type: type ? type : 'info', text: message},
      panelClass: type ? type : 'info',
      duration: duration ? duration : 0,
      horizontalPosition: 'right'
    });
  }
}

有了duration = 0，小吃店就不会消失。

从Snackbar组件中的SnackBar更改panelClass

1 个答案: