Как убедиться, что наложение не исчезает сразу после прикосновения на сенсорном устройстве - PullRequest
0 голосов
/ 14 января 2019

Я пытаюсь отобразить оверлей с некоторой информацией после длительного нажатия на элемент (для простоты сделал это обычным нажатием в примере). После нажатия на этот оверлей он должен снова исчезнуть.

Это упрощенная версия того, чего я пытаюсь достичь. https://plnkr.co/edit/qzU1Ah6ekCbljlWRpvI9?p=preview

 var app = angular.module('myApp', []);
    app.controller('ngClickCtrl', ["$scope", function ($scope) {

      $scope.hasDetail=false;
      $scope.hideDetail = function () {
          $scope.hasDetail = false;
      };

      var element = document.getElementsByClassName("base")[0];
      var passiveEventListenerOptions = {
          passive: true,
          once: false
      };

      element.addEventListener('touchstart',
          handleStart,
          passiveEventListenerOptions);

      element.addEventListener('mousedown',
          handleStart,
          passiveEventListenerOptions);

      function handleStart () {
        $scope.hasDetail = true;
        $scope.$applyAsync();
      }

    }]);

<div ng-controller="ngClickCtrl">
    <div class="base" ng-click="handleStart()">Base</div>
    <div ng-class="{'show-detail':hasDetail}" class="detail" ng-click="hideDetail()">Detail</div>
</div>

Он отлично работает на рабочем столе с помощью мыши, но после того, как я попробую на сенсорном устройстве или в режиме устройства инспектора, наложение сразу исчезает после отпускания.

Небольшое примечание: не двигайте пальцем или мышью во время тестирования, потому что это не воспроизведет проблему.

...