Angular ng-click 在包装器内部时无法在 IE 11 上运行 div

Question

我有一个网格，由ng-repeat生成。在生成的网格元素中，有一个 ng-click 指令，它不会在 IE11 上触发，但在 Chrome 和 Firefox 上工作正常。

我还发现，当我在网格元素上 "right-click -> Inspect Element" 时，包装器 div 被选为要检查的包装器，而不是我右键单击的特定网格元素.我的猜测是以某种方式将包装器 div 视为 "over" 网格元素。然而，即使我将网格元素的 z-index 设置为 9999999，情况也是一样的——根本没有记录点击。

布局代码如下：

<div id="gridHolder">                           <!-- wrapper div -->
  <div class="hex-row" ng-repeat="row in grid.data">
      <div class="hex center"                   <!-- grid elements -->
           ng-if="selectedClient.detailedtiles"
           ng-repeat="col in row"
           ng-class="hexClass(col)" ng-class-even="'even'">

            <div class="score" ng-click="plots(col)">    <!-- this doesn't work -->
                <span>{{ col.score }}</span>
                <div ng-class="{'arrowUp': col.tendency == 'rising'}"></div>
                <div ng-class="{'arrowDown': col.tendency == 'falling'}"></div>
            </div>
            <div class="ktScore"></div>
            <div class="vsScore" ng-click="improvement(col)"></div>    <!-- this doesn't work -->
            <div class="serviceName">{{ col.name }}</div>
      </div>

      <div class="hex center simple"            <!-- grid elements -->
           ng-if="!selectedClient.detailedtiles"
           ng-repeat="col in row"
           ng-class="hexClass(col)" ng-class-even="'even'"
           ng-click="plots(col)">               <!-- this doesn't work -->

            <div class="score" >
                <span>{{ col.score }}</span>
                <div ng-class="{'arrowUp': col.tendency == 'rising'}"></div>
                <div ng-class="{'arrowDown': col.tendency == 'falling'}"></div>
            </div>
            <div class="serviceName">{{ col.name }}</div>
      </div>
  </div>
</div>

这可能是什么原因造成的？如果 IE 认为包装器是 "over" 网格元素，我如何将点击事件传播到子元素？

Answer 1

您需要从 .hex class 中删除 pointer-events: none;。

pointer-events: none; 阻止所有点击元素。

删除了指针事件的分叉插件：http://plnkr.co/edit/LPVlsPPeqFzaxGG96jel?p=preview

请read here在CSS中了解更多关于指针事件的信息。

Angular ng-click 在包装器内部时无法在 IE 11 上运行 div

Angular ng-click not working on IE 11 when inside of a wrapper div

angularjs

angularjs-ng-repeat

angularjs-ng-click