javascript - 如何在 Angular 6 中将 Material 日期选择器日期值格式化为 "MM-DD-YYY"格式?

标签 javascript angular angular6

我正在尝试将以下日期格式化为 Angular 6 中的 MM-DD-YYYY 格式。我查看了 SO 和其他网站中发布的更简单的问题,但我无法解决它。

我正在使用 Material Angular DatePicker成分。

日期选择器给我

Thu Oct 25 2018 00:00:00 GMT+0400 (Gulf Standard Time)

我要格式化成

MM-DD-YYYY

我的代码

<mat-form-field>
    <input matInput [min]="minDate" [matDatepicker]="date" [(ngModel)]="request.date | request.date: 'dd/MM/yyyy hh:mm a'" placeholder="Choose a date">
    <mat-datepicker-toggle matSuffix [for]="date"></mat-datepicker-toggle>
    <mat-datepicker #date></mat-datepicker>
</mat-form-field>

我也试过像下面这样的 DatePipe 模块,但没有任何效果

this.datePipe.transform(this.request.date,"MM-DD-YYYY")

最佳答案

您可以使用 DatePipe根据您的要求格式化日期。

在 main.module.ts 中导入

import { DatePipe } from '@angular/common';

并在 Providers 数组中添加 Datapipe

然后在相关组件中导入同理

import { DatePipe } from '@angular/common';

在构造函数中

constructor(private datePipe : DatePipe)
{

}

要使用日期管道,只需使用

this.datePipe.transform(your_date, 'MM-dd-yyyy');

看看StackBlitz Example我在 MM-dd-yyyy 格式中安慰了日期值。

关于javascript - 如何在 Angular 6 中将 Material 日期选择器日期值格式化为 "MM-DD-YYY"格式?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52972187/

相关文章:

angular-components - 从组件中删除 ngModel

javascript - 左、右连接

javascript - 是否可以加快 Selenium 中的 move_to_element() 速度或者还有其他替代方案?

javascript - 发出第一个值然后忽略计时器内发出的值

angular - 如何使用 Jasmine 单元测试测试私有(private)方法

javascript - 我应该为项目使用angular-cli吗

angular - 模块 '[object Object]' 导入的意外值 'AppModule'

javascript - 在同一服务器(本地服务器)上运行两个 Angular 2+ 项目

javascript - 不呈现 instagram、twitter 和其他嵌入 Angular

javascript - 如何在 X 轴上显示固定标签,同时该轴上有数据?