How to enable databind in contenteditable on angular dart

Question

In AngularJs the way to do it is in the response Two way binding of contenteditable item inside ng-list

How to make it work in AngularDart? I search for a directive method in the Module class source file but nothing.

Answer 1

I made a pull request: https://github.com/angular/angular.dart/pull/412 The code is simple:

@NgDirective(selector: '[contenteditable=true][ng-model]')
class ContentEditableDirective extends _InputTextlikeDirective {

  // The implementation is identical to _InputTextlikeDirective but use innerHtml instead of value
  get typedValue => (inputElement as dynamic).innerHtml;
  set typedValue(String value) => (inputElement as dynamic).innerHtml = (value == null) ? '' : value;

  ContentEditableDirective(dom.Element inputElement, NgModel ngModel, Scope scope):
      super(inputElement, ngModel, scope);

}

It works. Maybe a better way exist but I find this elegant because it reuse code.

Answer 2

We don't have any official support yet, but pull requests are welcome!

The best way to do it right now is to create an ng-model directive which listens for blur events.