“日期格式错误”Angular 10 Rest Django答案

【问题标题】："Date has wrong format" Angular 10 Rest Django“日期格式错误”Angular 10 Rest Django
【发布时间】：2020-08-15 11:36:27
【问题描述】：

您好，我是这两个框架的新手，需要您的帮助！

所以我将 Rest Django 用于后端，将 Angular 用于 Frontent，我还在 DatePicker 使用 Angular 材料，尽管我将日期格式更改为 YYYY-MM-DD 到 DatePicker 我仍然收到错误消息“日期格式错误。请改用以下格式之一：YYYY-MM-DD。”发送api时由服务器！

为了更改 Angular 中的日期格式，我将此代码用于 app.module

import { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE } from '@angular/material/core';
import { MomentDateModule, MomentDateAdapter } from '@angular/material-moment-adapter';

export const DateFormats = {
            parse: {
                dateInput: ['YYYY-MM-DD']
            },
            display: {
                dateInput: 'YYYY-MM-DD',
                monthYearLabel: 'MM YYYY',
                dateA11yLabel: 'LL',
                monthYearA11yLabel: 'MM YYYY',
            },
        };
providers: [
          { provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE] },
          { provide: MAT_DATE_FORMATS, useValue: DateFormats }
  ],

console.log('date',this.date) 后查看我收到的datepicker输入的日期对象

date 
{…}

_d: Date Tue Aug 18 2020 00:00:00 GMT+0100 (UTC+01:00)

_i: Object { year: 2020, month: 7, date: 18 }

_isAMomentObject: true

_isUTC: false

_isValid: true

_locale: Object { _calendar: {…}, _longDateFormat: {…}, _invalidDate: "Invalid date", … }

_pf: Object { empty: false, overflow: -1, charsLeftOver: 0, … }

<prototype>: Object { add: createAdder(val, period), calendar: calendar$1(time, formats), clone: clone(), … }

你知道我该如何解决这个问题吗？

【问题讨论】：

实际请求内容是什么？在请求中查看您的网络选项卡，查看实际发送的内容。
error Object { headers: {…}, status: 400, statusText: "Bad Request", url: "127.0.0.1:8000/MyProjects/project", ok: false, name: "HttpErrorResponse", message: "Http 127.0.0.1:8000/MyProjects/project 的失败响应：400 Bad Request”，错误：{…} }
error {…} error: {…} datefin: Array [ "日期格式错误。请改用以下格式之一：YYYY-MM-DD。" ]
这些是我收到的，你知道有什么问题吗？
2020-08-18 这是我在日期选择器上添加的日期，您看到它也是 YYYY-MM-DD 谢谢您的关注

标签： django-rest-framework datepicker angular-material date-format angular10

【解决方案1】：

你应该创建一个方法来修剪你的日期删除时区和其他通知然后在你的日期输入字段中调用该方法像这样的东西 yourDateApp.component.ts 文件

trimDate(myDate){
  let strDate = JSON.stringfy(myDate.value)
  let newDate = strDate.substring(1, 11)
  //assign the new trimmed date to date value in ur form
  yourForm.controls['date_field'].setValue(newDate)
}

yourDateApp.component.html 文件 //像这样在html文件中调用你的函数

<input matInput (dateChange)="trimDate($event)">

这将接受日期将其修剪为 django 将识别它的方式

【讨论】：