Angular mobileQuery.addEventListener 不是 safari 中的函数，如何修复？

Posted 2023-02-23

【中文标题】Angular mobileQuery.addEventListener 不是 safari 中的函数，如何修复？

【英文标题】：Angular mobileQuery.addEventListener is not a function in safari, how to fix?

【发布时间】：2021-03-30 10:28:48

【问题描述】：

我正在使用有角度的材质 sidenav，它会在设备的最大宽度上出现一些断点。

这里是例子

Angular material documentation example The same example in stackblitz

看起来像这样：

public mobileQuery: MediaQueryList;
private _mobileQueryListener: () => void;

constructor(changeDetectorRef: ChangeDetectorRef, media: MediaMatcher)
    this.mobileQuery = media.matchMedia('(max-width: 992px)');
    this._mobileQueryListener = () => changeDetectorRef.detectChanges();
    this.mobileQuery.addEventListener('change', this._mobileQueryListener);


ngOnDestroy(): void 
    this.mobileQuery.removeEventListener('change', this._mobileQueryListener);

在 safari 我得到这个错误：

this.mobileQuery.addEventListener 不是函数

this.mobileQuery.removeEventListener 也是如此。

如何解决？

【参考方案1】：

试试这个

this.mobileQuery.addListener(this._mobileQueryListener);

和

this.mobileQuery.removeListener(this._mobileQueryListener);