Tuesday, March 28, 2017

Break up the ngModel antipattern.

This could be refactored like this:

<div>
   <input (keydown)="whateverEvent($event)" [value]="whatever" />
   <div>{{whatever}}</div>
   <button (click)="resetIt()">reset</button>
</div>

 
 

In the component itself, some of the TypeScript could be...

export class MySillyComponent {
   public whatever: string;
   public resetIt():void {
      this.whatever = "meh";
   }
   public whateverEvent(metadataCarriedAcross:any):void{
      this.whatever = metadataCarriedAcross.target.value;
   }
   constructor() {
      this.whatever = "";
   }
}

No comments:

Post a Comment