如何从数据库中以需要的格式显示日期，从 iso8601 到 type="date"

Question

大家好！显示日期表格数据库有问题。我在数据库中有项目的 expiryDate 字段：数据库类型 "date" 示例：“2019-12-12” 当我在 angular 中获取 json 中的日期表单时，如下所示：到期日期的图像（https://i.stack.imgur.com/23uhm.png） iso8601

我正在创建 CRUD 功能 - 更新，我想显示之前的日期，但我不知道该怎么做。当我想显示上一个日期时的图像 - http://prntscr.com/orrj6d

我试了几个例子，但没有用

project.ts:

this.dateInForm = new Date(expiryDate.dayOfMonth, expiryDate.monthValue - 1, expiryDate.year);
console.log(this.dateInForm); // => Tue Jun 11 1918 00:00:00 GMT+0202 (Восточная Европа, летнее время)



// expiryDate format is : 
//chronology: {id: "ISO", calendarType: "iso8601"}
//dayOfMonth: 12
//dayOfWeek: "THURSDAY"
//dayOfYear: 346
//era: "CE"
//leapYear: false
//month: "DECEMBER"
//monthValue: 12
//year: 2019

project.html:

<div>
<input type="date" style="font-size: 13px;" formControlName="expiryDate" [(ngModel)]="dateInForm"  class="question" class="form-control" placeholder="expiryDate" required autocomplete="off"/>
<label for="msg"><span></span></label>
</div>
<div *ngIf="updateProjectForm.controls.expiryDate.invalid &&(updateProjectForm.controls.expiryDate.dirty || updateProjectForm.controls.expiryDate.touched)">
<div *ngIf="updateProjectForm.controls.expiryDate.errors?.minDate">
     <p class="err-msg">
       expiryDate is  invalid
     </p>
</div>
 </div>

我不知道如何在 html type="date" 中显示日期请帮忙)

Answer 1

如果您使用 date 类型的本机 input 元素，则无需将其转换为 JavaScript 日期对象。如 documentation 所述，value 属性接受

A DOMString representing a date in YYYY-MM-DD format, or empty.

您应该将输入元素绑定到 YYYY-MM-DD 格式的字符串值。

在你的 component.html,

<input type="date" style="font-size: 13px;" [(ngModel)]="dateInForm"  class="question" class="form-control" placeholder="expiryDate" required autocomplete="off"/>

在你的 component.ts,

dateInForm: string = '';

// other parts of the code

this.dateInForm = `${expiryDate.year}-${expiryDate. monthValue}-${expiryDate. dayOfMonth}`;

我已经在 here 上创建了一个演示。

如何从数据库中以需要的格式显示日期，从 iso8601 到 type="date"

How to display date in need format from database, from iso8601 to type="date"

javascript

java

spring

crud

angular