how to display date in HTML Date control using angular 13

Question

While performing the edit operation using angular 13, I'm using HTML input type date. When fetching a date from the database, it is not showing the date in the textbox. Kindly help me.
update-movie.component.html

      <div class="mb-2">
        <label>Release Date</label>
        <input type="date" name="releaseDate" class="form-control" [(ngModel)]="movieService.movieData.releaseDate"
          #releaseDate="ngModel" [value]=movieService.movieData.releaseDate required
          [class.is-invalid]="releaseDate.invalid && releaseDate.touched">
      </div>```

Check that the date has the corresponding format (in my country it's dd/mm/aaaa) — , Apr 15 '22 at 11:20
check this answer if it helps. the procedure it's the same https://stackoverflow.com/questions/53784879/retrieving-a-date-from-mysql-in-a-html-form — raOliveira, Apr 15 '22 at 11:27
Do you have any errors in the DevTools console ? And please give us an example of a value fetched from the backend for the releaseDate, or even for the whole movieService object. — CCBet, Apr 15 '22 at 11:46

score 0 · Answer 1 · answered Apr 15 '22 at 15:17

I found the answer, instead of [value] I used [ngModel] and applied date pipe.

        <label>Release Date</label>
        <input type="date" name="releaseDate" class="form-control" [(ngModel)]="movieService.movieData.releaseDate"
          #releaseDate="ngModel" [ngModel]="movieService.movieData.releaseDate | date : 'yyyy-MM-dd'" required
          [class.is-invalid]="releaseDate.invalid && releaseDate.touched">
      </div>

how to display date in HTML Date control using angular 13

1 Answers1