【问题标题】:Angular flex layout stopped working after print dialog打印对话框后角度弹性布局停止工作
【发布时间】:2020-07-11 21:12:52
【问题描述】:
我已经使用角材料和角弹性布局创建了一个角应用程序。该应用程序的问题是,每当我在 chrome 中按 Ctrl + P 时,导航栏中的所有菜单都会消失,并且应该只出现在移动设备中的菜单按钮会出现,最重要的是整个应用程序变得无法使用。我必须刷新浏览器才能使应用程序可重用。我从 angular flex layout 的 github issue pages 中读到,当打印对话框出现时 UI 线程被中断,因此出现了问题。有没有办法解决这个问题。
我为相同的“angular-responsive-navbar”创建了一个 git 存储库,以便任何人都可以重现该问题。
【问题讨论】:
标签:
angular
printing
responsive
angular-flex-layout
【解决方案1】:
关闭打印对话框后,在 MediaMarshaller 中恢复活动断点会出现一些问题。您可以使用以下代码进行临时修复。
export class CommonMaterialModule {
lastValue;
public constructor (
m: MediaMarshaller,
) { // @ts-ignore
m.subject.subscribe((x) => {
// @ts-ignore
if (m.activatedBreakpoints.filter((b) => b.alias === 'print').length === 0) {
// @ts-ignore
this.lastValue = [...m.activatedBreakpoints];
} else {
// @ts-ignore
m.activatedBreakpoints = [...this.lastValue];
// @ts-ignore
m.hook.collectActivations = () => {};
// @ts-ignore
m.hook.deactivations = [...this.lastValue];
}
});
}
}
详细解释请参考this link。