代码之家 › 专栏 › 技术社区 › chuckd

使用角度日期管道在表单中格式化ngModel中的日期时间

formatdatetime datetime angular html

chuckd · 技术社区 · 5 年前

我把这个放在下面的什么地方 birthDate 是“1938-08-08T00:00:00”,我希望它是“dd/MM/yyyy”,但我似乎不知道如何在中使用角度日期管道 ngModel

<input type="text" class="form-control" placeholder="ex. MM/DD/YYYY" [(ngModel)]=matterData.birthDate name="birthDate">

我尝试了这个,但没有成功:

[(ngModel)]={{matterData.birthDate | date: 'dd/MM/yyyy'}}

我能让它工作的唯一方法是先用'formatDate()'格式化.ts代码中的日期

0 回复 | 直到 5 年前

Arun Rajagopal 5 年前

我不明白你为什么要在ngModel中格式化它。

您的HTML应该如下所示:

<input type="text" class="form-control" placeholder="ex. MM/DD/YYYY" [value]="matterData.birthDate | date: 'dd/MM/yyyy'" name="birthDate">

https://stackblitz.com/edit/angular-ubpthb

Zbynek Vrana 5 年前

在Angular 9上,这适用于我,具有双向绑定:

<input type="date" class="form-control" name="birthDate" [(ngModel)]="matterData.birthDate" [ngModel]="matterData.birthDate | date:'dd/MM/yyyy'" required>

-1

Spandan 5 年前

Using Pipes within ngModel on INPUT Elements in Angular

<input type="text" class="form-control" placeholder="ex. MM/DD/YYYY" [ngModel]="matterData.birthDate | date: 'dd/MM/yyyy'" (ngModelChange)="matterData.birthDate=$event" name="birthDate">

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

8 月前

Jamie · 在CSS链接的文件名中添加Jinja占位符

9 月前

ptownbro · 重叠分区标签,同时保持以下所有分区和内容就位

9 月前

Luke Frost IEng MIMechE · Bootstrap 5.3在Div中的项目位置没有如我所期望的那样显示

9 月前

Reegan · 使用Angular ngFor指令在html中渲染嵌套对象值

9 月前

wqyutv · 当找不到文件时,任何破坏错误的东西都不会出现,我该怎么解决这个问题?

9 月前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

9 月前

Gukkey · 在React中明确隐藏日期类型输入后,如果我单击父div,如何显示日期选择器?

9 月前

Lorenzo Bertolaccini · 在Angular项目中通过对话框后,在控制台中显示但在HTML中不显示的数据数组

9 月前

john Rizzo · 按钮背景颜色、悬停和活动状态存在问题

9 月前