Angular js / ionic app url 链接和功能链接无效

Question

我正在开发一个 angular 基于 js / ionic 的应用程序，我是新手。

在我的应用程序中，我检索 Strava 数据并将其通过 .append();
注入 div 这就是我在 .append():

中的内容

$("#list").append("<div><p>some text <a href='https://www.strava.com/athletes/...' target='_blank'>url_link</a></p><p><a on-tap='myFunction()'>trigger_function_link</a></p></div>");

上面的代码本身运行良好，除了其中的两点。
(1)当我按下第一个 link 时，URL 在我的浏览器的新页面中打开，但在我的应用程序中没有打开。
我尝试了不同的东西（org.apache.cordova.inappbrowser， javascript、angular js 解决方案）但非有效。

(2)当我按下第二个 link 时，点击功能没有被触发。

当我将上面的 div 直接复制粘贴到我的 HTML 中时（因此它没有被注入）一切正常，url links 在新页面或我的本机中打开我设备上的浏览器应用程序和 angular 点按功能被正确触发。

<div><p>some text <a href='https://www.strava.com/athletes/...' target='_blank'>url_link</a></p><p><a on-tap='Strava()'>trigger_function_link</a></p></div>

现在最大的问题是，为什么当我的代码被注入 .append() 时，我的 link 无法正常工作，是否有修复方法？

谢谢！！

Answer 1

为什么要使用 jQuery，angular 已经为其编写了指令。

我建议您使用 ng-if 指令，请将 div 保留在您的 html 中，并带有一些标志，例如 showDiv。每当 showDiv 为 true 时 div 将被添加到 DOM（显示在 html 上）并且当该标志为假时 div 将从 DOM 中删除（将被隐藏）

<div ng-if="showDiv">
  <p>some text <a href='https://www.strava.com/athletes/...' target='_blank'>url_link</a></p>
  <p><a on-tap='myFunction()'>trigger_function_link</a></p>
</div>

更新

您正在从 ajax 获取数据（Ajax 调用应该使用 $http 而不是使用 jQuery），将该数据存储在 $scope.objs = 数据并多次附加相同的 div，我建议您使用 ng-repeat 来渲染所有 div，这样会更有效。

<div id="list">
    <div ng-repeat="obj in objs">
        <p>{{obj.clubmember}}<a href='strava.com/athletes/...' ; target='_blank'>url_link</a></p>
        <p><a on-tap='myFunction()'>trigger_function_link</a></p>
    </div>
</div>

Answer 2

附加内容不标准AngularJS。如果您想 "append HTML"，请咨询供应商 $compile

否则，您应将您的内容定义为@pankajparkar

提供的AngularJSHTML模板

Angular js / ionic app url 链接和功能链接无效

Angular js / ionic app url links and function links not working

javascript

angularjs

cordova

ionic-framework

angular-ng-if