我的指示停止工作与另一个指令相结合.Angular.js

Question

我有一个指令编辑一个动态称为" click-to-to-edit"字段。如果我单击一个项目，我可以在没有问题的情况下进行编辑。

<span ng-click="ignoreClick($event);" >
  <a href='' click-to-edit item="faq" ng-model='faq.pregunta'
     typeinput='textarea'>{{faq.pregunta}}
  </a>

我有一个过滤器，可以突出显示单词时，该过滤器称为"荧光笔"。如果我添加行

ng-bind-html="faq.pregunta | highlight:search.pregunta"

我无法单击以编辑字段。

，但是过滤器对我有用。我不需要错过编辑字段的功能，而不会突出显示文本时会受到损坏。我该如何解决？

https://jsfiddle.net/jv5o6s8y/

Answer 1

ng-bind-html的问题是它替换了指令的模板，这就是为什么您无法在指令内单击(带有切换的原始ng-click不起作用(，它不包含它初始模板。您应该突出显示指令模板中某个地方的文字，例如：

<div class="hover-text-field" ng-show="!editState" ng-click="toggle()" ng-bind-html="model | highlight:search.pregunta"></div>

，检查此工作JSFIDDLE。