因为我ng-bind-html用到了ng-click,需要用compile,但是我看的文档都是在directive里面写compile,问题是我是在过滤器filter里面用compile,怎么用啊,网上一点资源都找不到。
app.filter('httpClickFilter',function($sce){
return function(inputText){
var textHttpArray = inputText.split('http');
textHttpArray[textHttpArray.length-1] = textHttpArray[textHttpArray.length-1] + ' ';
for(var i = 1;i < textHttpArray.length; i++){
var textSubstring = 'http' + textHttpArray[i].substring(0,textHttpArray[i].indexOf(' '));
var replaceTextHttp = "<span style='color:#fe7979' ng-click='httpLinkClick()'>"+textSubstring+"</span>";
inputText = inputText.replace(textSubstring,replaceTextHttp);
}
return $sce.trustAsHtml(inputText);
}
})
HTML:<span ng-bind-html="item.text | httpClickFilter"></span>
大体的意思是:拦截一段text字段,查找里面的http链接,把HTTP链接修改为可点击。这里使用过滤器没问题吧!
http://stackoverflow.com/questions/19726179/how-to-make-ng-bind-html-compile-angularjs-code보충제
데이터 변환만 수행하는 경우 여기에서 필터를 사용하는 것이 의심할 여지 없이 올바른 선택입니다. 그러나
ng-click
과 같은 동적 이벤트 바인딩에 관여하고 있으므로 현재 이 요구 사항을 처리하기 위해 필터를 사용하는 것은 적합하지 않습니다. 필터는 데이터를 대상으로 추가 처리를 수행합니다. 필터를 사용하여 렌더링 논리를 처리하는 경우 이는 원래 의도가 아닙니다. 필터를 디자인하기 위해 Angular를 사용합니다.ng-click
这种动态的事件绑定,这时候还想着用filter去处理这种需求是不适合的。filter是对我们的输入进行额外的处理,针对的是数据,注意了,是针对数据,职责很明确,如果你拿filter处理渲染的逻辑违反了单一职责原则,这并不是angular设计filter的初衷。OK,如果你硬要写在filter里,那么
좋아요, 필터에 작성하라고 하면httpLinkClick
httpLinkClick
메서드는 $rootScope에만 매달릴 수 있습니다. HACK을 구현하는 유일한 방법은 없습니다. 으아악하지만 불행히도 trustAsHtml이 모든 바인딩된 이벤트를 처리하기 때문에 쓸모가 없습니다.
분명히 이러한 요구 사항은 지침을 사용하여 구현되어야 합니다. 각 기능에는 고유한 사용 시나리오가 있다는 점을 이해해야 합니다.
으아악주제에서 벗어남
텍스트가 사용자 입력에서 나온 경우 XSS 공격에 주의해야 합니다. 다음 텍스트를 사용해 보세요
으아악http://stackoverflow.com/a/18149450/2586541