mardi 17 mai 2016

Angular 2 Polymer and a PaperChechboxSelectedDirective

I am trying to get Ng2 an Polymer to work together. To do so my objective is to create some Directives that listen to the paper-elements and converts the events or do whatever needs to be done to make angular understand the user interactions.

If I do this:

<paper-checkbox [checked]="bar" (change)="bar = $event.target.__data__.checked">
    Mark all as complete
</paper-checkbox>

I get bi-directional binding working with Ng2 (it's weird that I have to look into data to find the value of the checkbox though... any pointers on that one anyone ?).

So every thing work but I would like to cut on the ceremonies and have a Directive that get my 'bar' expression and sets it via the onChange Handler. Is this possible ?

The paper-checkbox directive

  @Directive({selector: 'paper-checkbox'})
  class PaperChechboxSelectedDirective {

    @Output() checkedChange:EventEmitter<any> = new EventEmitter();

    constructor(private element: ElementRef) {
      console.log('PaperChechboxSelectedDirective');
    }

    @HostListener('iron-change', ['$event'])
    onChange(e) {

    }
  }




Aucun commentaire:

Enregistrer un commentaire