首页 文章

如何检测离子项内元素的点击？

提问于
浏览 次
6

使用ion-list和ion-item，我无法检测到按钮或div等元素的点击 .

例如，使用ng-click在此处不起作用：

<ion-list>
      <ion-item ng-repeat="device in devices">
          <div ng-click="deviceOption(device.id)"> CLICK HERE</div>                                            
      </ion-item>
</ion-list>

我尝试过使用ion-option-button，但它并不适合使用 .

为什么我们不能用一个简单的离子按钮指令来检测离子项内的点击？

ionic-framework ionic

4 回答

  • 2

    所以问题与 ion-item 更改内部 div 的 z-index 有关，并且点击无法传播 . 你可以轻松绕过它，改变内部 div 的 z-index ：

    <ion-content class="padding">
  <ion-list>
    <ion-item >
      <div style="z-index: 1000;" ng-click="test()"> CLICK HERE</div>                                            
    </ion-item>
  </ion-list>
</ion-content>

    angular.module('app', ['ionic']).controller('ctrl', function($scope){
  $scope.test = function(){
    alert('hello');
  };
})

    参见游乐场：http://play.ionic.io/app/6227e101719b

    回复于
  • 3

    添加 enable-pointer-events 类应该这样做 .

    <ion-list>
  <ion-item ng-repeat="device in devices">
      <div class="enable-pointer-events" ng-click="deviceOption(device.id)"> CLICK HERE</div>                                            
  </ion-item>
    回复于
  • 6

    我遇到过同样的问题

    使用'on-tap'而不是'ng-click'解决了这个问题！

    回复于
  • 0

    有史以来最简单的方法！只需将活动更改为“点击”

    <ion-list>
          <ion-item ng-repeat="device in devices">
              <div on-tap="deviceOption(device.id)"> CLICK HERE</div>                                            
          </ion-item>
</ion-list>
    回复于

相关问题