fix(angular): fix ngModel accessor

This commit is contained in:
Manu Mtz.-Almeida
2018-10-31 19:19:13 +01:00
parent 8eacad2d06
commit fab8b604a5
5 changed files with 20 additions and 56 deletions

View File

@ -23,27 +23,20 @@ export class BooleanValueAccessor implements ControlValueAccessor {
onChange: (value: any) => void;
onTouched: () => void;
/**
* Whether onChange should be mutted (not be fired). Will be true only when writeValue was called, which
* means that value changed inside angular form (e.g. calling setValue on a control).
*/
private muteOnChange = false;
private lastValue: any;
writeValue(value: any) {
this.muteOnChange = true;
this.element.nativeElement.checked = value;
this.element.nativeElement.checked = this.lastValue = value;
setIonicClasses(this.element);
}
@HostListener('ionChange', ['$event.target.checked'])
_handleIonChange(value: any) {
if (!this.muteOnChange) {
if (value !== this.lastValue) {
this.lastValue = value;
this.onChange(value);
}
this.muteOnChange = false;
requestAnimationFrame(() => {
setIonicClasses(this.element);
});

View File

@ -23,30 +23,22 @@ export class NumericValueAccessor implements ControlValueAccessor {
onChange: (value: any) => void;
onTouched: () => void;
/**
* Whether onChange should be mutted (not be fired). Will be true only when writeValue was called, which
* means that value changed inside angular form (e.g. calling setValue on a control).
*/
private muteOnChange = false;
private lastValue: any;
writeValue(value: any) {
this.muteOnChange = true;
// The value needs to be normalized for IE9, otherwise it is set to 'null' when null
// Probably not an issue for us, but it doesn't really cost anything either
this.element.nativeElement.value = value == null ? '' : value;
this.element.nativeElement.value = this.lastValue = value == null ? '' : value;
setIonicClasses(this.element);
}
@HostListener('ionChange', ['$event.target.value'])
_handleInputEvent(value: any) {
if (!this.muteOnChange) {
if (value !== this.lastValue) {
this.lastValue = value;
this.onChange(value);
}
this.muteOnChange = false;
requestAnimationFrame(() => {
setIonicClasses(this.element);
});

View File

@ -19,21 +19,15 @@ export class RadioValueAccessor implements ControlValueAccessor {
onChange: (value: any) => void;
onTouched: () => void;
private lastValue: any;
constructor(private element: ElementRef) {
this.onChange = () => {/**/};
this.onTouched = () => {/**/};
}
/**
* Whether onChange should be mutted (not be fired). Will be true only when writeValue was called, which
* means that value changed inside angular form (e.g. calling setValue on a control).
*/
private muteOnChange = false;
writeValue(value: any) {
this.muteOnChange = true;
this.element.nativeElement.checked = this.value = value;
this.element.nativeElement.checked = this.lastValue = this.value = value;
requestAnimationFrame(() => {
setIonicClasses(this.element);
@ -42,12 +36,11 @@ export class RadioValueAccessor implements ControlValueAccessor {
@HostListener('ionSelect', ['$event.target.checked'])
_handleIonSelect(value: any) {
if (!this.muteOnChange) {
if (value !== this.lastValue) {
this.lastValue = value;
this.onChange(value);
}
this.muteOnChange = false;
requestAnimationFrame(() => {
setIonicClasses(this.element);
});

View File

@ -23,16 +23,10 @@ export class SelectValueAccessor implements ControlValueAccessor {
onChange: (value: any) => void;
onTouched: () => void;
/**
* Whether onChange should be mutted (not be fired). Will be true only when writeValue was called, which
* means that value changed inside angular form (e.g. calling setValue on a control).
*/
private muteOnChange = false;
private lastValue: any;
writeValue(value: any) {
this.muteOnChange = true;
this.element.nativeElement.value = value;
this.element.nativeElement.value = this.lastValue = value;
requestAnimationFrame(() => {
setIonicClasses(this.element);
@ -41,12 +35,11 @@ export class SelectValueAccessor implements ControlValueAccessor {
@HostListener('ionChange', ['$event.target.value'])
_handleChangeEvent(value: any) {
if (!this.muteOnChange) {
if (value !== this.lastValue) {
this.lastValue = value;
this.onChange(value);
}
this.muteOnChange = false;
requestAnimationFrame(() => {
setIonicClasses(this.element);
});

View File

@ -23,16 +23,10 @@ export class TextValueAccessor implements ControlValueAccessor {
onChange: (value: any) => void;
onTouched: () => void;
/**
* Whether onChange should be mutted (not be fired). Will be true only when writeValue was called, which
* means that value changed inside angular form (e.g. calling setValue on a control).
*/
private muteOnChange = false;
private lastValue: any;
writeValue(value: any) {
this.muteOnChange = true;
this.element.nativeElement.value = value;
this.element.nativeElement.value = this.lastValue = value;
requestAnimationFrame(() => {
setIonicClasses(this.element);
@ -41,12 +35,11 @@ export class TextValueAccessor implements ControlValueAccessor {
@HostListener('ionChange', ['$event.target.value'])
_handleInputEvent(value: any) {
if (!this.muteOnChange) {
if (value !== this.lastValue) {
this.lastValue = value;
this.onChange(value);
}
this.muteOnChange = false;
requestAnimationFrame(() => {
setIonicClasses(this.element);
});