feat(module:datepicker): support input

NG-ZORRO · Dec 19, 2017 · 697d1cb · 697d1cb
1 parent 424fb7b
commit 697d1cb
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 3 deletions.
diff --git a/src/components/calendar/nz-calendar.component.ts b/src/components/calendar/nz-calendar.component.ts
@@ -418,7 +418,7 @@ export class NzCalendarComponent implements OnInit {
       return false;
     }
   }
-  
+
   _buildMonth(d: Moment): WeekInterface[] {
     const weeks: WeekInterface[] = [];
     const _rawDate = this._removeTime(d);

diff --git a/src/components/datepicker/nz-rangepicker.component.ts b/src/components/datepicker/nz-rangepicker.component.ts
@@ -107,8 +107,11 @@ import { toBoolean } from '../util/convert';
            [class.ant-calendar-range-right]="part === _part.End">
         <div class="ant-calendar-input-wrap">
           <div class="ant-calendar-date-input-wrap">
-            <input class="ant-calendar-input" [placeholder]="nzPlaceholder[part]"
-                   [value]="_value[part] | nzDate: nzFormat">
+            <input class="ant-calendar-input"
+                   [placeholder]="nzPlaceholder[part]"
+                   [value]="_value[part] | nzDate: nzFormat"
+                   #dateBox
+                   (blur)="_blurInput(dateBox, part)">
           </div>
         </div>
         <div class="ant-calendar-header">
@@ -399,6 +402,13 @@ export class NzRangePickerComponent implements ControlValueAccessor, OnInit {
     this._value[part] = $event;
   }
 
+  _blurInput(box: HTMLInputElement, part: RangePart): void {
+    if (Date.parse(box.value)) {
+      this._value[part] = new Date(box.value);
+      this.onChange(this._value);
+    }
+  }
+
   _hoverDay(day: DayInterface): void {
     if (!this._isComplete() && this._value.some(e => moment(e).isValid())) {
       this._hoveringSelectValue = day.date.toDate();