离子框架使得“在新标签中打开”选项不适用于ios设备中的ng-href

Question

我试图在移动设备中实现功能，其中点击将打开'codepen.io'（通过ng-click处理）并点击并按住将打开上下文菜单，其中包含'打开新标签'选项，这导致' 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并点击并加载错误的网址。

我有问题在ios设备中实现了功能，在iphone X之前没有在ios设备中的“ 点击并按住 ”上打开上下文菜单。

如果从head标签中删除离子框架源，则代码可在ios设备中使用。 但是，我正在为angularJS应用程序使用离子框架。 所以无法避免。

有没有办法在ios设备中实现'open in new tab'选项，而离子仍然存在？

这是codepen链接： demo

Answer 1

在您的代码中， -webkit-touch-callout属性可能是none 。 删除或添加以下样式，将解决此问题

body {-webkit-touch-callout: default !important;}

离子框架使得“在新标签中打开”选项不适用于ios设备中的ng-href

问题描述

1 个解决方案

解决方案1
2 已采纳 2018-12-05 09:31:45

离子框架使得“在新标签中打开”选项不适用于ios设备中的ng-href

问题描述

1 个解决方案

解决方案1 2 已采纳 2018-12-05 09:31:45

解决方案1
2 已采纳 2018-12-05 09:31:45