javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-22 13:32:54 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(input): pass the control classes down to the native input

Browse Source 
this is to make the native input, ion-input and item all have the same
classes for the control

references #6040
This commit is contained in:
Brandy Carney
2016-05-21 13:08:38 -04:00
parent 702a88225b
commit 6180cb83ab
2 changed files with 24 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/components/input/input-base.ts
View File

@ -99,25 +99,36 @@ export class InputBase {
} }
}; };
this.setItemControlCss(); this.setItemInputControlCss();
} }
ngAfterContentChecked() { ngAfterContentChecked() {
this.setItemControlCss(); this.setItemInputControlCss();
} }
private setItemControlCss() { private setItemInputControlCss() {
let item = this._item; let item = this._item;
let nativeInput = this._native;
let inputControl = this.inputControl; let inputControl = this.inputControl;
// Set the control classes on the item
if (item && inputControl) { if (item && inputControl) {
item.setCssClass('ng-untouched', inputControl.untouched); this.setControlCss(item, inputControl);
item.setCssClass('ng-touched', inputControl.touched);
item.setCssClass('ng-pristine', inputControl.pristine);
item.setCssClass('ng-dirty', inputControl.dirty);
item.setCssClass('ng-valid', inputControl.valid);
item.setCssClass('ng-invalid', !inputControl.valid);
} }
// Set the control classes on the native input
if (nativeInput && inputControl) {
this.setControlCss(nativeInput, inputControl);
}
}
private setControlCss(element, control) {
element.setCssClass('ng-untouched', control.untouched);
element.setCssClass('ng-touched', control.touched);
element.setCssClass('ng-pristine', control.pristine);
element.setCssClass('ng-dirty', control.dirty);
element.setCssClass('ng-valid', control.valid);
element.setCssClass('ng-invalid', !control.valid);
} }
ngOnDestroy() { ngOnDestroy() {

4
src/components/input/native-input.ts
View File

@ -164,6 +164,10 @@ export class NativeInput {
return this.element().value; return this.element().value;
} }
setCssClass(cssClass: string, shouldAdd: boolean) {
this._renderer.setElementClass(this._elementRef.nativeElement, cssClass, shouldAdd);
}
element(): HTMLInputElement { element(): HTMLInputElement {
return this._elementRef.nativeElement; return this._elementRef.nativeElement;
} }