如何使用角度 2 将当前日期转换为 YYYY-MM-DD 格式答案

【问题标题】：how to convert current date to YYYY-MM-DD format with angular 2如何使用角度 2 将当前日期转换为 YYYY-MM-DD 格式
【发布时间】：2021-12-31 20:01:47
【问题描述】：

我用这条线来获取当前日期

public current_date=new Date();

我得到了这个结果：

Wed Apr 26 2017 10:38:12 GMT+0100 (Afr. centrale Ouest)

我怎样才能把它转换成这种格式

YYYY-MM-DD

【问题讨论】：

标签： angular date typescript

【解决方案1】：

对于 Angular 5

app.module.ts

import {DatePipe} from '@angular/common';
.
.
.
providers: [DatePipe]

demo.component.ts

import { DatePipe } from '@angular/common';
.
.
constructor(private datePipe: DatePipe) {}

ngOnInit() {
   var date = new Date();
   console.log(this.datePipe.transform(date,"yyyy-MM-dd")); //output : 2018-02-13
}

更多信息angular/datePipe

【讨论】：

我收到此错误：错误错误：InvalidPipeArgument：'缺少区域设置“de-DE”的区域设置数据。'对于管道'DatePipe'

【解决方案2】：

文档示例

@Component({
  selector: 'date-pipe',
  template: `<div>
    <p>Today is {{today | date}}</p>
    <p>Or if you prefer, {{today | date:'fullDate'}}</p>
    <p>The time is {{today | date:'jmZ'}}</p>
  </div>`
})
export class DatePipeComponent {
  today: number = Date.now();
}

模板

{{ dateObj | date }}               // output is 'Jun 15, 2015'
{{ dateObj | date:'medium' }}      // output is 'Jun 15, 2015, 9:43:11 PM'
{{ dateObj | date:'shortTime' }}   // output is '9:43 PM'
{{ dateObj | date:'mmss' }}        // output is '43:11'
{{dateObj  | date: 'dd/MM/yyyy'}} // 15/06/2015

在您的组件中使用。

@Injectable()
import { DatePipe } from '@angular/common';
class MyService {

  constructor(private datePipe: DatePipe) {}

  transformDate(date) {
    this.datePipe.transform(myDate, 'yyyy-MM-dd'); //whatever format you need. 
  }
}

在您的 app.module.ts 中

providers: [DatePipe,...]

您所要做的就是立即使用此服务。

【讨论】：

OP 的预期输出在哪里？
@RameshRajendran：更新

【解决方案3】：

试试下面的代码，它也适用于 angular 2

<span>{{current_date | date: 'yyyy-MM-dd'}}</span>

【讨论】：

实际上我需要它来比较组件中的未来日期
这个date: 'yyyy/MM/dd'是一种常用的使用角度格式化日期的过滤方式，您可以创建一个常量来声明'yyyy/MM/dd'的格式并将常量调用到您的组件
能否请你给我同样的例子，如何在格式化后将当前日期从模板传递到组件
只需使用new Date(this.current_date.replace(/-/g, "/")); 或更多详细信息：stackoverflow.com/questions/3505693/…
清洁解决方案！

【解决方案4】：

这是一种非常简洁的方法，您也可以根据需要更改此功能：

结果：03.11.2017

//get date now function
    getNowDate() {
    //return string
    var returnDate = "";
    //get datetime now
    var today = new Date();
    //split
    var dd = today.getDate();
    var mm = today.getMonth() + 1; //because January is 0! 
    var yyyy = today.getFullYear();
    //Interpolation date
    if (dd < 10) {
        returnDate += `0${dd}.`;
    } else {
        returnDate += `${dd}.`;
    }

    if (mm < 10) {
        returnDate += `0${mm}.`;
    } else {
        returnDate += `${mm}.`;
    }
    returnDate += yyyy;
    return returnDate;
}

【讨论】：

【解决方案5】：

添加模板并给出日期管道，日期格式需要使用转义字符。您可以根据需要提供任何格式，例如“MM-yyyy-dd”等。

template: '{{ current_date | date: \'yyyy-MM-dd\' }}',

【讨论】：

【解决方案6】：

你可以导入

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

方法的标准格式。

formatDate(value: string | number | Date, format: string, locale: string, timezone?: string)

所以在这里，您所要做的就是将您的“current_date”作为值传递给方法，然后是格式（在您的情况下为“YYYY-MM-DD”），然后是语言环境，时区是可选的。

例如

formatDate(current_date,'yyyy-MM-dd',"en-US");

你会得到你想要的输出。

如需更多参考，您可以查看 Angular-formatDate

【讨论】：

这很完美，但要正确显示它应该是 formatDate(current_date,'yyyy-MM-dd',"en-US") 否则它显示一月为 0，二月为 1，三月如 2 等...
谢谢@Danielle。我也更新了。

【解决方案7】：

ES6/TypeScript 中的解决方案：

let d = new Date;
console.log(d, [`${d.getFullYear()}`, `0${d.getMonth()}`.substr(-2), `0${d.getDate()}`.substr(-2)].join("-"));

【讨论】：