feat(module: input-item): fix input-item bug (#500)

* feat(module: input-item): fix input cursor bug * feat(module: input-item): hide keyboard when editable is false
NG-ZORRO · Jul 22, 2019 · 9f9f579 · 9f9f579
1 parent 50ade9b
commit 9f9f579
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 18 deletions.
diff --git a/components/input-item/input-item.component.html b/components/input-item/input-item.component.html
@@ -21,7 +21,7 @@
       <input #inputElement
              [type]="type"
              [name]="name"
-             [ngModel]="value"
+             [(ngModel)]="value"
              [defaultValue]="defaultValue"
              [placeholder]="placeholder"
              [disabled]="disabled"

diff --git a/components/input-item/input-item.component.spec.ts b/components/input-item/input-item.component.spec.ts
@@ -56,12 +56,12 @@ describe('InputComponent', () => {
     component.value = 'test';
     fixture.detectChanges();
     inputEle = inputItem.nativeElement.querySelector('input');
-    expect(inputEle.value).toBe('test', 'type is text');
+    expect(inputEle.getAttribute('ng-reflect-model')).toBe('test', 'type is text');
 
     component.value = null;
     fixture.detectChanges();
     inputEle = inputItem.nativeElement.querySelector('input');
-    expect(inputEle.value).toBe('', 'value is undefined');
+    expect(inputEle.getAttribute('ng-reflect-model')).toBe('', 'value is undefined');
 
     component.type = 'money';
     fixture.detectChanges();
@@ -76,7 +76,7 @@ describe('InputComponent', () => {
     component.defaultValue = 'default test';
     fixture.detectChanges();
     inputEle = inputItem.nativeElement.querySelector('input');
-    expect(inputEle.value).toBe('test', 'type is text');
+    expect(inputEle.getAttribute('ng-reflect-model')).toBe('test', 'type is text');
 
     component.type = 'money';
     fixture.detectChanges();
@@ -109,7 +109,7 @@ describe('InputComponent', () => {
     component.defaultValue = 'test';
     fixture.detectChanges();
     inputEle = inputItem.nativeElement.querySelector('input');
-    expect(inputEle.value).toBe('test', 'type is text');
+    expect(inputEle.getAttribute('ng-reflect-model')).toBe('test', 'type is text');
 
     component.type = 'money';
     fixture.detectChanges();

diff --git a/components/input-item/input-item.component.ts b/components/input-item/input-item.component.ts
@@ -26,7 +26,7 @@ import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
     }
   ]
 })
-export class InputItemComponent implements OnInit, AfterViewInit, OnChanges, ControlValueAccessor {
+export class InputItemComponent implements OnInit, AfterViewInit, ControlValueAccessor {
   prefixCls: string = 'am-input';
   wrapCls: object;
   labelCls: object;
@@ -298,9 +298,6 @@ export class InputItemComponent implements OnInit, AfterViewInit, OnChanges, Con
           break;
       }
       this._value = value;
-      if (this._type !== 'money') {
-        this.inputElementRef.nativeElement.value = this._value;
-      }
       this._onChange(this._value);
       this.onChange.emit(this._value);
     }, 0);
@@ -315,6 +312,9 @@ export class InputItemComponent implements OnInit, AfterViewInit, OnChanges, Con
   }
 
   inputFocus(value) {
+    if (!this._editable && document.activeElement instanceof HTMLElement) {
+      document.activeElement.blur();
+    }
     setTimeout(() => {
       this._focus = true;
       this.clsFocus = true;
@@ -343,9 +343,6 @@ export class InputItemComponent implements OnInit, AfterViewInit, OnChanges, Con
     this.onChange.emit(this._value);
     this._onChange(this._value);
     this._isClear = true;
-    if (this._type !== 'money') {
-      this.inputElementRef.nativeElement.value = this._value;
-    }
     this.inputFocus(this._value);
   }
 
@@ -375,12 +372,6 @@ export class InputItemComponent implements OnInit, AfterViewInit, OnChanges, Con
 
   registerOnTouched(fn: any): void {}
 
-  ngOnChanges() {
-    if (this.inputElementRef && this._type !== 'money' && this._value !== undefined) {
-      this.inputElementRef.nativeElement.value = this._value;
-    }
-  }
-
   ngOnInit() {
     this.setCls();
     this.render.addClass(this._el, this._prefixListCls + '-item');