phạm vi ion không thể nhấp vào ios

Question

Tôi đang sử dụng đầu vào "dải" ion trong một dự án nền tảng chéo. Đối với trình duyệt android và PC, nếu tôi nhấp vào khu vực cách xa nút trượt, nút thanh trượt sẽ chuyển đến điểm tôi nhấp và giá trị sẽ được cập nhật.

Nhưng đối với IOS, khi tôi nhấp vào khu vực cách xa nút thanh trượt, sẽ không có thay đổi giá trị nào xảy ra. Và điều này cũng làm cho thanh trượt của tôi khó bấm, tôi cần phải bấm rất chính xác ngay trên nút trượt, nếu không thanh trượt sẽ không trượt. Bất kỳ ý tưởng nào?

Answer 1

Tôi tin rằng tôi đã tìm được giải pháp cho việc này. Thêm vào-tap() để yếu tố của bạn như vậy:

<div class="range"> 
     <input type="range" on-tap="onTap($event)" ng-model="barProgress" min="0" max="100"> 
    </div> 

Sau đó thêm này trong điều khiển của bạn (hoặc cảm thấy tự do để thực hiện một chỉ thị ra khỏi nó)

$scope.onTap = function(e) { 
     if(ionic.Platform.isIOS()) { 
     $scope.barProgress = (e.target.max/e.target.offsetWidth)*(e.gesture.touches[0].screenX - e.target.offsetLeft); 
     } 
    }; 

Về cơ bản những gì bạn đang làm là tính toán vị trí của vòi tương ứng với màn hình, và sau đó điều chỉnh giá trị để làm việc với thanh trượt, để có được giá trị đầu vào thực tế mà nó sẽ đã được. Sau đó, bạn cập nhật mô hình.

EDIT: Điều này sẽ chỉ hoạt động với sự kiện nhấp/nhấn. Để làm cho nó mượt mà và tự nhiên hơn, chúng ta cũng cần phải bật/trượt trên thanh trượt. Sửa chữa rất đơn giản sẽ cho phép các nhà phát triển thực hiện việc này. Chỉ cần thêm on-drag = "onTap ($ event)" để html của bạn trông như thế này.