相关疑难解决方法(0)

我正在尝试将panelClass配置添加到Angular Material Snackbar.

我通过以下官方网站的文档编写了以下代码.

import { Component, OnInit } from '@angular/core';
import { MatSnackBar, MatSnackBarConfig } from "@angular/material";
import { Location } from '@angular/common';

@Component({
  selector: 'snack-bar-component-example',
  templateUrl: './snack-bar-component-example.html',
  styleUrls: ['./snack-bar-component-example.css']
})
export class SnackBarComponentExample implements OnInit {

  constructor(public snackBar: MatSnackBar) { }

  ngOnInit() {
  }

  saveButtonClick = () =>{
    this.snackBar.open("This is a message!", "ACTION", {
      duration: 3000,
      panelClass: ["font-family:'Open Sans', sans-serif;"]
    });
  }
}

我已经将事件绑定到HTML按钮.当我删除panelClass配置时,持续时间配置工作正常.我正在导入Google字体(Open Sans)并尝试将字体应用于Snackbar.但是,我收到一个错误:

ERROR DOMException: Failed to execute 'add' on …

我想将材料小吃店放在我的标题下（它的高度为 60 像素）。

问题是verticalPosition 将snackbar 放在顶部并覆盖标题。我试图添加“margin-top: 75px”，但上面的区域无法点击。（有叠加）

我无法更改 cdk-overlay-pan 的样式，因为我还有其他对话框。