Question

我可以像这样设置小吃店消息的持续时间

let config = new MdSnackBarConfig();
config.duration = 5000;

this.snackBar.open(element.text, 'OK', config);

但是我需要设置多个零食栏的持续时间，而不是每次都不必传递配置。

我可以以某种方式设置全局持续时间配置吗？

谢谢！

Answer 1

我们所做的工作包括模块级别的外部 app.config.ts 文件，并将其包含在我们需要的位置。这是文件中的内容示例。

export class Config {
    static apiUrl = "api/";
    static token = "";
    static snackBarDurration = 5000;
    ......
}

然后，您所要做的就是在模块中声明它，然后将其导入您要使用它的组件或服务中。这是一个例子。

import { Injectable } from "@angular/core";
import { Config } from "../../app.config";

@Injectable()
export class SnackBarService {

    .... // declare your snackbar here

    constructor() { }

    showSnackBar(elementText: string){
        let config = new MdSnackBarConfig();
        config.duration = Config.snackBarDurration; // Here is your change

        this.snackBar.open(elementText, 'OK', config);
    }
}

Answer 2

我知道这篇文章是几年前的，但是为了将来参考，我还是要回答这个问题。希望我能像我一样帮助遇到这篇文章的人。

您现在可以使用MatSnackBar中的提供程序，为@NgModule注入模块的默认选项：

import { MatSnackBarModule, MAT_SNACK_BAR_DEFAULT_OPTIONS } from '@angular/material';

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

来源：Material Angular doc's

Answer 3

我知道这不是全局配置的解决方案，而是使调用更紧凑我在params中声明了config：

this.snackBar.open(elementText, 'OK', { duration: 3000 });

Angular 2 Snackbar - 全局持续时间配置

3 个答案: