Javascript 有角度标记且在应用浏览器中打开系统浏览器中的所有链接

我正在开发一款爱奥尼亚应用程序，用户可以发布降价内容。为了使这项工作，我正在使用图书馆。在应用程序中，我希望所有的降价链接都能在操作系统的默认浏览器中打开，所以我做了两件事

我已经编写了一个angular指令，该指令强制使用AppBrowser中的ngCordova-wrapper for cordova插件在操作系统浏览器中打开链接

我已将angular marked的配置设置为使用此指令渲染所有链接

问题是这些链接无法在系统浏览器中打开。它们在当前WebView中打开。可能是我的指令不好，或者在这种情况下，指令甚至不是正确的使用方法

我在我的代码中写些什么？如何解决在系统浏览器中打开链接的问题

我的指令。 我的配置

.config（[
“$compileProvider”，
“markedProvider”，
函数（$compileProvider，markedProvider）
{
$compileProvider.ahrefsanitationwhitelist（/^\s*（https？| ftp | mailto | chrome扩展名）：/）；
//渲染标记时，请使用外部链接指令。
markedProvider.setRenderer({
链接：函数（href、标题、文本）{
返回“”；
}
});
}
])

您的代码有两个问题

1.角度指令的名称应在

camelCase

中，它将转换为HTML中的

kebab case

。这很容易修复，只需更改即可 到

2.在您的HTML中有

，但angular不会

$compile

（实例化）它。 这是一个很难的问题（如果你不想让它成为猴子的话）

angular-marked

使用

element.html（marked（text，scope.opts | | null））

要设置元素的内部HTML，它会跳过angular的编译过程，因此不会初始化指令

一种解决方法是使用全局函数（我不知道）：

在app.run中定义它：

.run(function ($cordovaInAppBrowser) {
  window.openInSystemBrowser=function(link){
     $cordovaInAppBrowser.open(link, '_system');
  };

并将angular配置为使用onclick，以便它独立于angular工作

markedProvider.setRenderer({
        link: function (href, title, text) {
          return '<a onclick="openInSystemBrowser(\'' + href + '\')"' + (title ? ' title="' + title + '"' : '') + '>' + text + '</a>';
        }
      });

与

---

更新2 我检查了repo，angular marked（v1.2）的最新版本支持一个名为

compile

的属性，以实现这一点

e、 g

到

---

2.将属性

compile='true'

添加到

指令您的代码有两个问题

1.角度指令的名称应在

camelCase

中，它将转换为HTML中的

kebab case

。这很容易修复，只需更改即可 到

2.在您的HTML中有

，但angular不会

$compile

（实例化）它。 这是一个很难的问题（如果你不想让它成为猴子的话）

angular-marked

使用

element.html（marked（text，scope.opts | | null））

要设置元素的内部HTML，它会跳过angular的编译过程，因此不会初始化指令

一种解决方法是使用全局函数（我不知道）：

在app.run中定义它：

.run(function ($cordovaInAppBrowser) {
  window.openInSystemBrowser=function(link){
     $cordovaInAppBrowser.open(link, '_system');
  };

并将angular配置为使用onclick，以便它独立于angular工作

markedProvider.setRenderer({
        link: function (href, title, text) {
          return '<a onclick="openInSystemBrowser(\'' + href + '\')"' + (title ? ' title="' + title + '"' : '') + '>' + text + '</a>';
        }
      });

与

---

更新2 我检查了repo，angular marked（v1.2）的最新版本支持一个名为

compile

的属性，以实现这一点

e、 g

到

---

2.将属性

compile='true'

添加到

指令如果您正在寻找一种在带有标记的移动设备上的本机浏览器中打开链接的简便方法，请尝试在angular.config中设置此属性：

markedProvider.setRenderer({
  link: function(href, title, text) {
    return "<a href='" + href + "'" + (title ? " title='" + title + "'" : '') + " onclick='window.open("+href+", '_system')'" + " target='_system'>" + text + "</a>";
  }
});

---

如果您正在寻找一种在带有标记的移动设备上的本机浏览器中打开链接的简单方法，可以尝试在angular.config中设置此选项：

markedProvider.setRenderer({
  link: function(href, title, text) {
    return "<a href='" + href + "'" + (title ? " title='" + title + "'" : '') + " onclick='window.open("+href+", '_system')'" + " target='_system'>" + text + "</a>";
  }
});

---

你能在dropbox或任何文件共享服务中共享你的应用程序吗？你能在dropbox或任何文件共享服务中共享你的应用程序吗？酷！是否仍然可以使用

marked（）

函数强制编译。还是只是为了指令？我问这个问题的唯一原因是因为我不相信我能在标记的指令中正确地绑定范围数据。我不这么认为，因为

marked（）

来自，这个repo与角度无关。只需使用属性compile=“true”的

指令即可。仍然无法实现您想要的吗？我要说的是，

{{someVar}}

无法正确渲染。它将数据包装在

标记中。不过我将尝试使用

模板。

{{someVar}

这确实有效，我在控制器中编写了

$scope.someVar=“Hello”并且在viewCool中显示“Hello”！是否仍然可以使用
marked（）
函数强制编译。还是只是为了指令？我问这个问题的唯一原因是因为我不相信我能在标记的指令中正确地绑定范围数据。我不这么认为，因为
marked（）
来自，这个repo与角度无关。只需使用属性compile=“true”的
指令即可。仍然无法实现您想要的吗？我要说的是，
{{someVar}}
无法正确渲染。它将数据包装在
标记中。不过我将尝试使用
模板。
{{someVar}
这确实有效，我在控制器中编写了
$scope.someVar=“Hello”并且它在视图中显示“Hello”
element.html(marked(text, scope.opts || null));

element.replaceWith($compile(marked(text, scope.opts || null))(scope));

<marked compile="true">
          # Markdown [Google](http://www.google.com)
          *It works!*
</marked>

 .directive('fab-extLink', ...

 .directive('fabExtlink', ...

markedProvider.setRenderer({
  link: function(href, title, text) {
    return "<a href='" + href + "'" + (title ? " title='" + title + "'" : '') + " onclick='window.open("+href+", '_system')'" + " target='_system'>" + text + "</a>";
  }
});

document.addEventListener('deviceready', onDeviceReady, false);

function onDeviceReady() {
  window.open = cordova.InAppBrowser.open;
}