fix(demo): add handling of ionBlur

This commit is contained in:
Ken Sodemann
2017-11-16 11:08:54 -06:00
parent 17862880a9
commit fbf7bc675f
3 changed files with 10 additions and 5 deletions

View File

@ -5,7 +5,7 @@
<ion-grid>
<ion-row>
<ion-col>
<input id="stdTextInput" name="stdTextInput" [(ngModel)]="stdTextInput" (change)="change($event)" (blur)="onBlur($event)" />
<input id="stdTextInput" name="stdTextInput" [(ngModel)]="stdTextInput" />
</ion-col>
<ion-col>
Entered Data: <span id="stdTextInputOutput">{{stdTextInput}}</span>
@ -13,7 +13,7 @@
</ion-row>
<ion-row>
<ion-col>
<ion-input id="ionTextInput" name="ionTextInput" [(ngModel)]="ionTextInput" (change)="change($event)" (ionBlur)="onBlur($event)"></ion-input>
<ion-input id="ionTextInput" name="ionTextInput" [(ngModel)]="ionTextInput"></ion-input>
</ion-col>
<ion-col>
Entered Data: <span id="ionTextInputOutput">{{ionTextInput}}</span>
@ -21,7 +21,7 @@
</ion-row>
<ion-row>
<ion-col>
<input type="checkbox" id="stdCheckbox" name="stdCheckbox" [(ngModel)]="stdCheckbox" (change)="change($event)" (blur)="onBlur($event)"/>
<input type="checkbox" id="stdCheckbox" name="stdCheckbox" [(ngModel)]="stdCheckbox" (blur)="onBlur($event)"/>
</ion-col>
<ion-col>
Entered Data: <span id="stdCheckboxOutput">{{stdCheckbox}}</span>
@ -29,7 +29,7 @@
</ion-row>
<ion-row>
<ion-col>
<ion-checkbox id="ionCheckbox" name="ionCheckbox" [(ngModel)]="ionCheckbox" (ionChange)="change($event)" (blur)="onBlur($event)"></ion-checkbox>
<ion-checkbox id="ionCheckbox" name="ionCheckbox" [(ngModel)]="ionCheckbox" (ionBlur)="onBlur($event)"></ion-checkbox>
</ion-col>
<ion-col>
Entered Data: <span id="ionCheckboxOutput">{{ionCheckbox}}</span>

View File

@ -24,6 +24,11 @@ export class IonCheckboxValueAccessorDirective implements ControlValueAccessor {
this.onChange(value);
}
@HostListener('ionBlur')
_handleBlurEvent() {
this.onTouched();
}
registerOnChange(fn: (value: any) => void): void {
this.onChange = fn;
}

View File

@ -26,7 +26,7 @@ export class IonInputValueAccessorDirective implements ControlValueAccessor {
this.onChange(value);
}
@HostListener('blur')
@HostListener('ionBlur')
_handleBlurEvent() {
this.onTouched();
}