fix(datepicker): reactive forms in onpush components (#2947)

valor-software · Nov 2, 2017 · 69bd6fa · 69bd6fa
1 parent 5662e20
commit 69bd6fa
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 3 deletions.
diff --git a/src/datepicker/bs-datepicker-input.directive.ts b/src/datepicker/bs-datepicker-input.directive.ts
@@ -1,4 +1,5 @@
 import {
+  ChangeDetectorRef,
   Directive, ElementRef, forwardRef, Host, OnInit, Renderer2
 } from '@angular/core';
 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
@@ -29,7 +30,9 @@ export class BsDatepickerInputDirective
 
   constructor(@Host() private _picker: BsDatepickerComponent,
               private _renderer: Renderer2,
-              private _elRef: ElementRef) {
+
+              private _elRef: ElementRef,
+              private changeDetection: ChangeDetectorRef) {
     this._picker.bsValueChange.subscribe((v: Date) => this._setInputValue(v));
   }
 
@@ -41,6 +44,7 @@ export class BsDatepickerInputDirective
     ) || '';
     this._renderer.setProperty(this._elRef.nativeElement, 'value', initialDate);
     this._onChange(v);
+    this.changeDetection.markForCheck();
   }
 
   onChange(event: any) {

diff --git a/src/datepicker/bs-daterangepicker-input.directive.ts b/src/datepicker/bs-daterangepicker-input.directive.ts
@@ -1,4 +1,4 @@
-import { Directive, ElementRef, forwardRef, Host, OnInit, Renderer2 } from '@angular/core';
+import { ChangeDetectorRef, Directive, ElementRef, forwardRef, Host, OnInit, Renderer2 } from '@angular/core';
 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
 import { formatDate } from '../bs-moment/format';
 import { getLocale } from '../bs-moment/locale/locales.service';
@@ -27,7 +27,8 @@ export class BsDaterangepickerInputDirective
 
   constructor(@Host() private _picker: BsDaterangepickerComponent,
               private _renderer: Renderer2,
-              private _elRef: ElementRef) {
+              private _elRef: ElementRef,
+              private changeDetection: ChangeDetectorRef)  {
     this._picker.bsValueChange.subscribe((v: Date[]) => this._setInputValue(v));
   }
 
@@ -48,6 +49,7 @@ export class BsDaterangepickerInputDirective
     }
     this._renderer.setProperty(this._elRef.nativeElement, 'value', range);
     this._onChange(date);
+    this.changeDetection.markForCheck();
   }
 
   onChange(event: any) {