1

I want to know the difference between ng-bind-html and bind-html-compile directives. For example I gave 

<p style='color:red'>test<p>

to ng-bind-html, this strips out the style where as bind-html-compile does not. May I know when each directive should be used. Thanks.

georgeawg
  • 48,608
  • 13
  • 72
  • 95
vino
  • 57
  • 1
  • 7

1 Answers1

6

bind-html-compile is not a standard Angular directive, it comes with the module https://github.com/incuna/angular-bind-html-compile and it is used to compile binded data.To make it simple, it is equivalent to write html in your source code: it will be re-evaluated and if other directives are found, they will work as expected.

ng-bind-html is a standard directive (bundled with Angular itself) and just output html strings without compiling it.

for example, if you controller has a variable with plain html, like in:

$scope.dataToDisplay = '<h1><strong>Title</strong></h1>';

Then you can go with ng-bind-html.

If you need to inject variables that contain html with other directives, such as:

$scope.dataToDisplay = '<h1 ng-show="showIfOtherVariable"><strong>Title</strong></h1>';

then you need to aforementioned module.

Enrico Deleo
  • 388
  • 2
  • 15