检测是移动打字稿上的用户而不发送新请求答案

【问题标题】：detect is user on mobile typescript without send new request检测是移动打字稿上的用户而不发送新请求
【发布时间】：2021-12-30 13:52:18
【问题描述】：

我在打字稿文件中有价值

readonly isMobile: boolean = false;

在 cosntructor 内部，我要检查它是否适用于移动或桌面应用程序版本：

    if (window.navigator?.maxTouchPoints > 0) {
        this.isMobile = true;
    }

在 HTML 文件中，如果 isMobile 为真，我想显示/隐藏一些东西，并且一切正常，但如果我在桌面版本上并且我手动调整屏幕大小以变小，isMobile 仍然是假的，我需要去检查元素 >> 选择移动设备并重新启动页面，如果 isMobile 为 true，则将显示基于内容，如果我将屏幕大小调整为像移动屏幕一样，值 isMobile 是否可以设置为 true？

【问题讨论】：

标签： html angular typescript mobile desktop

【解决方案1】：

你可以这样使用：

window.onresize = () => {
  let isMobile = false;
  console.log('RESIZING ...', window.innerHeight, window.innerWidth);
  const mobileWidthThreshold = 375; // For example
  if (window.innerWidth <= mobileWidthThreshold) {
    isMobile = true;
  } else {
    isMobile = false;
  }
  console.log(isMobile);
}

【讨论】：

这没关系，但是如何在构造函数中定义 value isMObile，而不是在函数中？
只读是不允许的

【解决方案2】：

在这种情况下，您可以监听窗口大小调整事件并设置 isMobile 值。

@HostListener('window:resize', ['$event'])
onResize(event) {
  // Check window size and do actions..
}

【讨论】：