setInnerHtml doesn't evaluate Mustache

Question

I add some HTML content adding setInnerHtml() inside my NgComponent.

Logging shows, that directives are instantiated but {{ctrl.xxx}} expressions are not evaluated.

For setting the HTML I use a directive derived form ng-bind-html with a custom NodeValidator and the following value method.

  set value(value) {
    _element.setInnerHtml((value == null ? '' : value.toString()),
                                             validator: validator);
    _log.finest(value);
    if(value != null) {
      BlockFactory template = _compiler(_element.children, _directiveMap);
      Block block = template.bind(_injector)(_scope);
    }
  }

I have also some <input type='text' ng-model='ctrl.someValue'> in the inserted HTML. The debugger shows that the ng-model is instantiated and
the getter ctrl.someValue gets called
but the input element doesn't show the returned value.

When I insert the generated HTML statically as template all works fine.

How can get dynamically inserted HTML fully processed by Angular.

score 1 · Accepted Answer · edited May 23 '17 at 12:20

EDIT

The package http://pub.dartlang.org/packages/bwu_angular contains this decorator/directive as bwu-safe-html

------

I found the solution here

  @NgOneWay('ac-bind-html')
  set value(value) {
    if(value == null) {
      _element.nodes.clear();
      return;
    }
    _element.setInnerHtml((value == null ? '' : value.toString()),
                                             validator: validator);
    _log.finest(value);
    if(value != null) {
      _compiler(_element.childNodes, _directiveMap)(_injector, _element.childNodes);
    }
  }

see also my answer on How to add a component programatically in Angular.Dart? for the full code

setInnerHtml doesn't evaluate Mustache

1 Answers1

Linked