使用 Typescript + Angular 填充日期输入答案

【问题标题】：Fill date input with Typescript + Angular使用 Typescript + Angular 填充日期输入
【发布时间】：2018-12-31 00:36:15
【问题描述】：

我一直在尝试用 TypeScript 填充日期输入，但没有成功：

我得到了 3 个日期，格式如下：dd/MM/yyyy... 因此，我解析了每个数字以将其格式更改为 yyyy-MM-dd，然后使用日期管道将其分配给每个输入的 ngModel var。我尝试了不同的格式，但似乎不起作用。

HTML：

<div>
    <input type="date" ngModel="inputDate | date:'yyyy-MM-dd'"">
</div>

<div>
    <input type="date" ngModel="inputDateFrom | date:'yyyy-MM-dd'"">
</div>
<div>
    <input type="date" ngModel="inputDateTo | date:'yyyy-MM-dd'"">
</div>

TS：

let dateFill = data[4] + '/' + data[5] + '/' + data[6];
let parsedDate = dateFill.split("/");

this.inputDate = this.datepipe.transform(new Date(parsedDate[2] + '-' + parsedDate[1] + '-' + parsedDate[0]), 'yyyy-MM-dd');
this.inputDateFrom = this.datepipe.transform(new Date(parsedDate[5] + '-' + parsedDate[4] + '-' + parsedDate[3]), 'yyyy-MM-dd');
this.inputDateTo = this.datepipe.transform(new Date(parsedDate[8] + '-' + parsedDate[7] + '-' + parsedDate[6]), 'yyyy-MM-dd');

【问题讨论】：

尝试使用2路数据绑定，[(ngModel)]="inputDate"

标签： angular typescript date input

【解决方案1】：

为了使绑定起作用，您需要用[( 包围ngModel，如下所示：

<input type="date" [(ngModel)]="inputDate | date:'yyyy-MM-dd'"">

更多绑定信息请见in the docs

您也不能在 ngModel 绑定中使用管道，因此您需要删除它：

<input type="date" [(ngModel)]="inputDate">

【讨论】：

感谢您的解释，它现在可以正常工作，但由于某种原因，日期变为负 1，有时日期和月份相加。示例：01/01/2018 显示 01/31/2018，02/03/2018 显示 01/02/2018（只看过一次）
在上面的示例中，data 设置为什么？
data[4, 5, 6] 来自一个表，其中“原始”日期作为字符串传递，格式为 dd/MM/yyyy
@prevox 我的意思是值是什么
日期管道有什么用？您不能自己构造字符串并将其传递给inputDate 吗？我这么说是因为构造 Date 对象会导致您的问题由于时区。