Angularjs UIのブートストラップポップオーバーでレンダリングに問題がある

Question

私はAngularJS-UI（v0.14.3）を使用するAngularJS（v1.4.7）指示文を持っています。

ディレクティブの中に、私は例えば、私はuib-tooltipを使用している場合に動作ポップオーバーを持っている：

... 
directiveContent += '<span uib-popover="Some normal text">Popover!</span>'; 
... 

私はuib-tooltip-htmlにこれを切り替えるとディレクティブのポップオーバーは失敗します。

... 
directiveContent += '<span uib-popover-html="Some <b>bold</b> text!">Popover!</span>'; 
... 

パースエラー表示される内容は、link:のディレクティブの一部に関連し、ディレクティブの内容が変更されるかどうかを確認してから、内容を再コンパイルします。

scope.$watch('content', function(value) { 
    var span = angular.element(element.find('span')[1]); 
    span.html(value); 
    $compile(span)(scope); // <--- SOME ERROR OCCURS HERE 
}); 

要素をイベントハンドラにバインドするためにコンパイルします。ここで

は、特定の$parseエラーです：

angular.js:12477 Error: [$parse:syntax] http://errors.angularjs.org/1.4.7/$parse/syntax?p0=%2F&p1=not%20a%20primary…expression&p2=14&p3=Some%20%3Cb%3Ebold%3C%2Fb%3E%20text!&p4=%2Fb%3E%20text! 
at Error (native) 
at https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:6:416 
at Object.s.throwError (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:209:339) 
at Object.s.primary (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:206:337) 
at Object.s.unary (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:205:503) 
at Object.s.multiplicative (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:205:249) 
at Object.s.additive (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:205:76) 
at Object.s.relational (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:205:19) 
at Object.s.equality (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:204:241) 
at Object.s.logicalAND (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:204:94) 
at Object.s.logicalOR (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:203:458) 
at Object.s.ternary (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:203:253) 
at Object.s.assignment (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:203:107) <span popover-append-to-body="true" popover-animation="true" uib-popover-html="Some <b>(anonymous function) @ angular.js:12477(anonymous function) @ angular.js:9246aa @ angular.js:8791K @ angular.js:8289g @ angular.js:7680g @ angular.js:7684g @ angular.js:7684g @ angular.js:7684g @ angular.js:7684g @ angular.js:7684g @ angular.js:7684g @ angular.js:7684g @ angular.js:7684(anonymous function) @ angular.js:7555(anonymous function) @ my-directive.js:57n.$digest @ angular.js:15826n.$apply @ angular.js:16097h @ angular.js:10546K @ angular.js:10744e @ angular.js:10695E @ angular.js:10734e @ angular.js:5507(anonymous function) @ angular.js:5784 

は、どのように私はこれを修正については行くだろうか？

Answer 1

は角-UI-ブートストラップレポにthis問題を参照してください。推奨されるアプローチツールチップ/ポップオーバー-HTMLを使用すると、引用符で囲まれたコンテンツをラップするとき：

'<span uib-popover-html="\'<span>Some <b>bold</b> text!</span>\'">Popover!</span>' 

Answer 2

私は多分それはあなたのために働くだろう、ツールチップを追加するには、次のコードを使用します。

<inactive_icon></inactive_icon>  

angular.element("inactive_icon") 
     .empty() 
     .replaceWith($compile('<i class="fa fa-minus-circle text-danger" tooltip-placement="right" uib-tooltip="File Inactive"></i>')($scope));