Làm cách nào để phát hiện các nhấp chuột trên một phần tử bên trong một mục ion?

Question

Sử dụng danh sách ion và mục ion, tôi không thể phát hiện một lần nhấn trên một thành phần như nút hoặc div.

Đối dụ, sử dụng ng nhấp chuột không hoạt động ở đây:

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

Tôi đã cố gắng sử dụng ion-option-nút thay vì nhưng nó không được straigthforward để sử dụng.

Tại sao chúng ta không thể có chỉ thị đơn giản ion-nút để phát hiện các nhấp chuột bên trong mục ion?

Answer 1

Vì vậy, vấn đề phải làm với ion-item thay đổi z-index của bên trong div và nhấp chuột không thể lan truyền qua. Bạn có thể nhận được xung quanh nó một cách dễ dàng, thay đổi z-index của khu vực nội div:

<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'); 
    }; 
}) 

Xem Playground: http://play.ionic.io/app/6227e101719b

Answer 2

Thêm enable-con trỏ-sự kiện lớp nên làm điều đó.

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

Answer 3

tôi đã cùng một vấn đề

Sử dụng 'on-tap' thay vì 'ng-click' đã giải quyết được vấn đề!

Answer 4

Phương pháp đơn giản nhất bao giờ hết! Chỉ cần thay đổi sự kiện thành 'bật-tap'

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