角NG绑定HTML的不安全，并在其中指令 [英] angular ng-bind-html-unsafe and directive within it

问题描述

Plunker链接

我有我要绑定的HTML到它的元素。

I have a element which I would like to bind html to it.

＆LT; D​​IV NG绑定HTML的不安全=细节上＆GT;＆LT; / DIV＆GT;

这工作。如今，伴随着它，我也有这势必会绑定HTML指令：

That works. Now, along with it I also have a directive which is bound to the bound html:

$ scope.details ='成功！ ＆LT; A HREF =＃/信息/ 12上＆GT;详情＆LT; / A＆GT;

但指令上与div和锚不评价。我如何工作的？

But the directive upper with the div and anchor do not evaluate. How do I make it work?

推荐答案

我也面临这个问题，并且小时后搜索我看了@ Chandermani的评论，这被证明是解决互联网。
你需要调用这个模式的编译指令：

I was also facing this problem and after hours searching the internet I read @Chandermani's comment, which proved to be the solution. You need to call a 'compile' directive with this pattern:

<div compile="details"></div>

JS：

.directive('compile', ['$compile', function ($compile) {
    return function(scope, element, attrs) {
        scope.$watch(
            function(scope) {
                // watch the 'compile' expression for changes
                return scope.$eval(attrs.compile);
            },
            function(value) {
                // when the 'compile' expression changes
                // assign it into the current DOM
                element.html(value);

                // compile the new DOM and link it to the current
                // scope.
                // NOTE: we only compile .childNodes so that
                // we don't get into infinite loop compiling ourselves
                $compile(element.contents())(scope);
            }
        );
    };
}])

您可以看到它的工作小提琴这里

这篇关于角NG绑定HTML的不安全，并在其中指令的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！