Я пытаюсь добиться функциональности на мобильных устройствах, где tap откроет 'codepen.io' (обрабатывается ng-click), а tap and hold откроет контекстное меню с В нем опция «Открыть в новой вкладке», которая ведет на «stackoverflow.com» (обрабатывается ng-href)

Вот код: HTML:

<head>
  <link href="https://code.ionicframework.com/nightly/css/ionic.css" rel="stylesheet">
  <script src="https://code.ionicframework.com/nightly/js/ionic.bundle.js">    </script>
</head>
<body>
  <div ng-app="myApp">
    <div ng-controller="MainController as main">
      <a ng-href="https://stackoverflow.com/" ng-click="$event.preventDefault(); main.getUrl()">The Link</a>
    </div>
  </div>
</body>

Контроллер (AngularJS 1.4.9):

(function() {
  'use strict';

  angular
    .module('myApp', [])
    .controller('MainController', MainController);


  function MainController() {
    var vm = this;

    vm.getUrl = function() {
      window.location.replace('https://codepen.io');
    }
  }

})();

$event.preventDefault(); был добавлен к ng-click, чтобы предотвратить замену 'href' ng-click при касании и загрузку неправильного URL-адреса.

У меня проблема с достижением функциональности на устройствах ios, где не открывалось контекстное меню при « касание и удерживание » на устройствах ios до Iphone X.

Если вы удалите исходный код ionic framework из тега head, код будет работать на устройствах ios. Однако я использую ionic framework для своего приложения angularJS. Так что этого не избежать.

Есть ли способ добиться того, чтобы опция «открыть в новой вкладке» была доступна на устройствах ios, где все еще есть ionic?

Вот ссылка на код: демонстрация

3
Psylence 29 Ноя 2018 в 10:31

1 ответ

Лучший ответ

В вашем коде свойство -webkit-touch-callout может иметь значение none . Переместите этот стиль или добавьте следующий стиль, чтобы решить эту проблему.

body {-webkit-touch-callout: default !important;}
2
Sarath K S 5 Дек 2018 в 09:31