如何在Angular 2应用程序中正确调用window.matchMedia（）

Question

在Angular应用程序中不应直接访问window对象，这样您就有机会在浏览器外运行应用程序，如何以“Angular方式”调用window.matchMedia() ？

Answer 1

您需要在末尾添加“匹配项”：

  if (window.matchMedia('(max-width: 889px)').matches) {
      //your code
   }

Answer 2

我希望您找到了解决方案，但如果您没有找到，请查看 cdk layout - media matcher

如果您不想在您的应用中导入 CDK 布局，您可以从 their git repo 复制媒体匹配器类的代码 很简单，只依赖CDK平台。