在过滤器中添加 ng-click 事件 [英] Adding an ng-click event inside a filter

问题描述

我对 Angular 还很陌生，但过去几周我一直在使用它，并且设法解决了我遇到的大部分问题.然而，这个让我难住了.

I'm fairly new to Angular but I've been using it the past few weeks and have managed to work out most of the problems I've come across. This one however has me stumped.

我有一个应用程序可以从 Twitter 中提取推文，然后 - 使用角度过滤器 - 提取所有 url 并将它们设置为链接的样式.这部分工作正常，但客户认为来自 Twitter 的链接不安全，因此他们希望每次点击链接时都会触发免责声明.很简单 - 我劫持了链接并将 href 换成了 ng-click="openLink('url')".这就是问题发生的地方 - ng-click 不起作用.

I have an app that pulls in tweets from Twitter then - using an angular filter - pulls out all the urls and styles them as links. This part works fine but the client decided that links from Twitter were't safe so they wanted a disclaimer to fire every time a link was clicked. Simple enough - I hijacked the link and swapped the href for an ng-click="openLink('url')". This is where the problem occurred - the ng-click doesn't work.

我很确定问题与 $compile() 有关 - 我以前也遇到过类似的问题 - 但我不知道何时何地调用它.

I'm pretty sure the problem has something to do with $compile() - I've had similar issues before - but I have no idea when or where to call it.

我创建了一个 Plunkr 这是我的精简版后.顶部的链接不是动态加载的，并且会很好地触发 alertUrl() 函数，但是过滤器生成的所有链接都失败了.

I've created a Plunkr that is a lite version of what I'm after. The link at the top isn't loaded in dynamically and fires the alertUrl() function fine, but all the links generated by the filter fail.

我可能遗漏了一些非常简单的东西，但它一直困扰着我一段时间，因此我们将不胜感激任何帮助.

I'm probably missing something really simple but it's been bugging me a while now so any help will be massively appreciated.

谢谢，
山姆

推荐答案

好吧，您发出的 html\content 需要针对 angularjs 进行编译才能解决警报功能.

Well you are correct that the html\content that you emit needs to be compiled for angularjs to resolve the alert function.

我已经改变了你的plunker，并注入了一个编译指令(来自这里)

I have changed your plunker, and inject a compile directive (from here)

查看实际效果此处

这里的基本思想是动态编译从 Twitter 提要生成的内容.

The basic idea here is to compile the content produced from twitter feed dynamically.

<p compile="tweet.text | convertLinks"></p>

这篇关于在过滤器中添加 ng-click 事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！