Angular DateModel stopps working on adding name attribut

Question

i want to have a dateField which gets filled, when the user enters the route. So this is the code i'm using:

formular1.component.ts

constructor(
    private validateService: ValidateService,
    private flashMessage: FlashMessagesService,
    private authService: AuthService,
    private router: Router,
    private terminalService: TerminalService
  ) {
    this.todaysDate = new Date();
  }

formular1.component.html:

<input type="date" [ngModel]="todaysDate | date:'dd-MM-yyyy'" (ngModelChange)="todaysDate = $event" [value]="todaysDate | date:'yyyy-MM-dd'">

This works fine, the dateField gets filled with the correct value but i get a big error inside my console:

Error: If ngModel is used within a form tag, either the name attribute must be set or the form
      control must be defined as 'standalone' in ngModelOptions.

      Example 1: <input [(ngModel)]="person.firstName" name="first">
      Example 2: <input [(ngModel)]="person.firstName" [ngModelOptions]="{standalone: true}">

Sounds simple... but when i add an name="test" attribute the dateField is no longer working and does not get filled with the date value - why?

Maybe someone can also tell me, how to get the correct time (summer / wintertime) here in germany we actually have +1 hour from the date i get by New Date();

score 1 · Accepted Answer · answered Dec 11 '17 at 16:38

The problem is with the date formating pipe

  <input type="date" name="todayDate" id="todayDate" [ngModel]="todaysDate | date:'yyyy-MM-dd'" (ngModelChange)="todaysDate = $event" [value]="todaysDate | date:'yyyy-MM-dd'">

If you want to convert to dd-mm-yyyy format check this one

Angular DateModel stopps working on adding name attribut

1 Answers1