Angular js / ionic app url 链接和函数链接不起作用



我正在开发一个基于角度js/ionion的应用程序,我是新手。

在我的应用程序中,我检索 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)当我按下第一个链接时,URL在我的浏览器中的新页面中打开,而不是在我的应用程序中。
我尝试了不同的东西(org.apache.cordova.inappbrowser,javascript,angular js解决方案),但没有工作。

(2)按下第二个链接时,点击功能没有被触发。

当我将上述div 直接复制粘贴到我的 HTML 中(因此没有注入)时,一切正常,url 链接在新页面或设备上的本机浏览器应用程序中打开,并且正确触发了角度点击功能。

<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() 时,为什么我的链接不起作用,是否有修复?

谢谢!!

为什么要使用 jQuery,而 angular 已经为它编写了指令。

我建议您使用ng-if指令,请将该div保留在您的html中,并带有一些标志,例如showDiv。每当showDivtrue时,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 = data 中并多次附加相同的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>

追加内容不是标准的 AngularJS。 如果您想"附加 HTML",请参阅提供商$compile

否则,您应将您的内容定义为 AngularJS HTML 模板,如@pankajparkar

最新更新