Angular点击事件笔记本屏幕失效，移动端正常问题求助

针对你遇到的桌面端点击函数不生效、移动端正常的问题，从代码和常见场景出发，给你几个排查和解决方向：

1. 移除重复的点击事件绑定 #

你的代码里嵌套的多个div都绑定了(click)="changeindex(i)"，桌面端的点击事件冒泡可能导致冲突，移动端触摸事件的处理逻辑不同才没暴露问题。建议只保留最外层可点击容器的事件绑定，修改循环内的结构：

<div *ngFor="let x of ourwork; let i = index" class="w-28 flex justify-center items-center align-middle">
  <!-- 只在这一层绑定点击事件 -->
  <div (click)="changeindex(i)" class="cursor-pointer text-center">
    <div [ngClass]="{'text-primary': activework == i}" class="font-semibold text-lg">
        {{x.title}}
    </div>
    <div *ngIf="activework == i">
        <img src="assets/Vector 35.png" class="w-4 ml-2 pt-1 inline-block">
    </div>
  </div>
</div>

同时给这个容器加上cursor-pointer，桌面端鼠标悬停时会显示指针，能直观确认点击区域范围。

2. 排查元素覆盖问题 #

桌面端的响应式布局可能导致某个元素（比如上方的md:pt-64容器、或者其他绝对定位元素）覆盖了可点击区域，导致点击事件被拦截。可以临时给可疑容器加半透明背景类，比如bg-blue-500/30，查看桌面端是否有元素叠在可点击区域上方。如果有，调整元素的z-index或者position属性，确保可点击元素层级更高。

3. 检查点击函数的逻辑 #

查看changeindex函数的实现，是否存在只针对移动端的判断逻辑（比如依赖isMobile变量、触摸事件相关的判断），如果有，移除这类限制，确保桌面端点击能正常触发函数。

4. 强制阻止事件冒泡（可选） #

如果还是存在事件冲突，可以在点击事件中加入阻止冒泡的逻辑：

<div (click)="changeindex(i); $event.stopPropagation()" class="cursor-pointer text-center">

内容的提问来源于stack exchange，提问作者rameez khan