Angular-material MatSnackBar默认持续时间

Question

我们的团队在应用程序中使用Angular材质的MatSnackBar。因为每个人负责不同的页面，所以每个页面的snackBars有不同的持续时间。有的设置为2000ms，有的设置为1000ms，有的甚至设置为3000ms。

我想从一个变量中获取持续时间值，这样我就可以在一个地方控制所有snackBars的持续时间。甚至可能是为了让开发人员在调用snackBar.open函数时不发送持续时间值。

this.snackBar.open(message, {
  duration: 2000,
});

最好的方法是什么？

Answer 1

您应该设置一个应用程序范围的default Snackbar configuration。

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

您仍然需要清理现有代码并删除传递了显式持续时间的实例，但未来的代码可以只使用this.snackbar.open(msg)，而不使用任何选项。

Answer 2

我通过包装MatSnackBar并使用dialog.open的工厂解决了这个问题。

import { Injectable } from '@angular/core';
import { MatSnackBar, MatSnackBarConfig } from '@angular/material';

@Injectable()
export class SnackBarService {
  private config: MatSnackBarConfig;
  constructor(private snackBar: MatSnackBar) {
this.config = new MatSnackBarConfig();
this.config.duration = 2000;
}
public open(message: string, duration?: number, action?: string) {
this.config = duration ? Object.assign(this.config, { 'duration': duration }) : this.config;
this.snackBar.open(message, action, this.config);
}}

Answer 3

对我来说最简单的方法就是

this.snackBar.open("Item added to Cart", "X", {"duration": 2000});

因此，对于您的情况，从centralized const变量中获取持续时间的值。