DateValueAccessor for Angular

A custom value accessor for Angular 2/4.
Now you can use JavaScript Date objects directly with two-way data bindings (ngModel) as well as with reactive forms (formControlName/formControl).

Examples:

You have to explicitly opt-in by adding the attribute useValueAsDate to a date input control:

<input type="date" name="myBirthday" ngModel useValueAsDate>
 
OR
 
<input type="date" name="myBirthday" [(ngModel)]="myBirthday" useValueAsDate>
 
OR
 
<input type="date" formControlName="myBirthday" useValueAsDate>

Installation:

Download the package via NPM:

npm install --save angular-date-value-accessor

Then import the module via NgModule:

// app.module.ts
 
import { DateValueAccessorModule } from 'angular-date-value-accessor';
 
@NgModule({
  imports: [
    DateValueAccessorModule
  ]
})
export class AppModule { }

Demo

There is a demo at: http://johanneshoppe.github.io/angular-date-value-accessor/