Question

我正在研究基于角度js /离子的应用程序，我对此很新。

在我的应用程序中，我检索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 solutions）但是非工作。

（2）当我按下第二个链接时，没有触发点击功能
当我在我的HTML中直接粘贴上面的div时（所以它没有注入）一切正常，url链接在新页面或我设备上的本机浏览器应用程序中打开，并且正确触发了角度点击功能。 / p>

<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（）我的链接无效，是否有修复？

谢谢！

Answer 1

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

我建议您使用ng-if指令，请在html中使用showDiv之类的标记保留该div。每当showDiv为true时，div就会被添加到DOM中（在html上显示）＆amp;当该标志为false时，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＆amp;多次添加相同的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。如果您想＆＃34;添加HTML＆＃34;，请参阅提供商$compile

否则，您应将内容定义为@pankajparkar提供的AngularJS HTML模板

Angular js / ionic app url链接和功能链接不起作用

2 个答案: