Insert HTML with scripts that should run

Question

One part of this app gets HTML back from the server that needs to be shown as live HTML. That's easily done with the ng-bind-html-unsafe="expression" directive (in Angular 1.0.2 at least).

However, the HTML also has JavaScript that should run, since it defines functions used in the HTML, and that doesn't seem to happen using the directive.

Is there some Angular-style way to do that? Or do I need to explore out-of-band script loading techniques?

(Please let's not discuss whether I should trust the server enough to run java-script it sends me. I do trust the server, I'm aware of the risks, and this is a very specialized situation.)

Answer 1

I can propose my variant. First you should create directive:

app.directive('html', [ function () {
  return {
    restrict: 'A',
    link: function (scope, element, attrs) {
      element.html(attrs.html);
    }
  }
}]);

Then you can use it inside tag.

<div html="{{code}}"></div>