我需要在系统浏览器中打开我的应用程序某个部分内的所有链接。诀窍是这些链接来自外部来源(API),所以我无法添加 ng-click
帮助我从外部打开链接的功能。
我正在使用 应用内浏览器 插件(ng-cordova)。事实上,我还有其他在外部打开的链接,但在这种情况下,链接可以位于内容的任何部分,所以我的问题是如何在加载后将 ng-click 指令添加到所有链接?或者如果可能的话,如何配置 in-app-browser 插件以打开系统浏览器中的所有链接?
顺便说一句,即使在 inappbrowser 中也无法打开简单的链接:我点击它们但没有任何 react 。
谢谢您的帮助
最佳答案
AFAIK 没有办法自动执行此操作,您必须使用应用程序内浏览器 js 代码在每个平台上一致地从外部打开链接。
你的问题没有给出服务器返回什么的明确例子,所以我假设你得到了一个完整的 html 块并且只是在屏幕上呈现它。假设一个请求返回一些基本的东西,比如:
<div id="my-links">
<a href='http://externallink.com'> External Link 1 </a>
<a href='http://externallink.com'> External Link 2 </a>
<a href='http://externallink.com'> External Link 3 </a>
</div>
您的请求如下所示:
$http.get('givemelinks').success(function(htmlData){
$scope.myContent = htmlData;
})
如果您可以访问服务器端并且可以进行更改:
在您的请求中添加一个“inappbrowser”参数,以检测它是否应该返回与 inappbrowser 兼容的链接,并将来自您的服务器的响应更改为如下所示:
if (inappbrowser) {
<div id="my-links">
<div ng-click='openExternal($event)' data-external='http://externallink.com'> External Link 1 </div>
<div ng-click='openExternal($event)' data-external='http://externallink.com'> External Link 2 </div>
<div ng-click='openExternal($event)' data-external='http://externallink.com'> External Link 3 </div>
</div>
} else {
<div id="my-links">
<a href='http://externallink.com'> External Link 1 </a>
<a href='http://externallink.com'> External Link 2 </a>
<a href='http://externallink.com'> External Link 3 </a>
</div>
}
并有一个通用的 openExternal 方法:
$scope.openExternal = function($event){
if ($event.currentTarget && $event.currentTarget.attributes['data-external'])
window.open($event.currentTarget.attributes['data-external'], '_blank', 'location=yes');
}
如果无法更改服务器端
解析响应并用 ng-clicks 替换链接:
$http.get('givemelinks').success(function(htmlData){
htmlData = htmlData.replace(/href='(.*)'/,'ng-click="openExternal($event)" data-external="$1"').replace(/<a/,"<div").replace(/a>/,"div>")
$scope.myContent = htmlData;
})
并使用与上面相同的 openExternal 方法。
我正在用 div 替换 anchor 以防止更改应用程序路由。这在每个应用程序中可能都不是必需的。
为了使它更好,您应该将其捆绑在
open-external
中。指令,以便您可以在多个 Controller 中使用它并保持它们的清洁。
关于angularjs - 使用 ionic 应用程序内的系统浏览器打开所有链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35049957/