从angular发送并在ASP.NET服务器中接收时，日期值会发生变化
我将一个包含来自Angular 6的两个日期的对象发送到ASP.NET Core Web API方法。Angular方面的日期是正确的，但是当在Web API方法中接收到这些日期时，它们比Angular应用程序发送的日期晚了一天。
startSprint(id: number, SprintDates: any): Observable<any> {
this.sprintId = id.toString();
return this.http.patch<any>(this.baseUrl + 'setSprintDates/' + this.sprintId,
SprintDates);
}上面的方法将dates对象发送到Web API方法。下面的方法是接收该对象的Web API方法，但是当我调试并将光标悬停在sprintDatesDto对象上时，收到的值比从Angular发送的值晚了一天。
[HttpPatch("setSprintDates/{sprintId}")]
public async Task<IActionResult> SetSprintDates(string sprintId, SprintDatesDto sprintDatesDto)
{
// Business login related code
return StatusCode(200);
}这是SprintDatesDto类：
namespace AgileFootPrints.API.Dtos
{
public class SprintDatesDto
{
public DateTime StartDate { get; set; }
public DateTime EndDate { get; set; }
}
}这是我在angular Typescript文件中创建的对象：
sprinDates = {
startDate: Date,
endDate: Date
};然后，在下面的Html文件中，我使用ngModel绑定到sprintDates对象属性：
<div class="row">
<div class="col-md-7 w-100 ">
<mat-form-field class="example-full-width">
<input
matInput
[(ngModel)]="sprinDates.startDate"
[min]="minDate"
[max]="maxDate"
[matDatepicker]="startsAt"
placeholder="Starts At"
/>
<mat-datepicker-toggle matSuffix [for]="startsAt"></mat-datepicker-toggle>
<mat-datepicker #startsAt></mat-datepicker>
</mat-form-field>
</div>
<br />
</div>
<div class="row">
<div class="col-md-7 w-100">
<mat-form-field class="example-full-width">
<input
[disabled]="sprinDates.startDate === undefined"
matInput
[(ngModel)]="sprinDates.endDate"
[min]="sprinDates.startDate"
[max]="maxDate"
[matDatepicker]="endsAt"
placeholder="Ends At"
/>
<mat-datepicker-toggle matSuffix [for]="endsAt"></mat-datepicker-toggle>
<mat-datepicker #endsAt></mat-datepicker>
</mat-form-field>
</div>
</div>回答 2
Stack Overflow用户
发布于 2020-10-07 21:04:06
可能的罪魁祸首是客户端和服务器之间的时区偏移。
当通过Angular HTTP客户端发送JavaScript日期时，使用JSON.stingify()方法将数据转换为JSON字符串。当日期转换为此字符串时，数值时间值实际上被修改为不反映时区偏移，而不是客户端的时区偏移。这是为了标准化实际时间，以防服务器处于不同的时区。
要解决此问题，您需要将日期时间转换为服务器可以解释的字符串格式。为此，有两种方法。您可以使用angular中的DatePipe，也可以使用可用的日期函数将日期转换为字符串。
import { DatePipe } from '@angular/common';在构造函数中：
private datePipe: DatePipe转换为您需要的任何日期时间格式。
this.sprinDates.StartDate = this.datePipe.transform(this.sprinDates.StartDate, 'MM/dd/yyyy');我提到的另一种方法是使用日期函数进行转换。
this.sprinDates.StartDate = this.sprinDates.StartDate ? this.sprinDates.StartDate.toLocaleString() : null;Stack Overflow用户
发布于 2019-02-18 03:15:23
问题在于Json解析日期的方式，默认情况下，在angular中，它会添加与协调时相比的本地时间(例如:如果您在午夜使用Gmt+1，它将转换为昨天协调时的晚上11点)，您需要做的是创建一个文件，该文件将覆盖MomentDateAdapter以忽略此转换，并以协调时创建选定的时间，如下所示：
import { Inject, Injectable, Optional } from '@angular/core';
import { MAT_DATE_LOCALE } from '@angular/material';
import { MomentDateAdapter } from '@angular/material-moment-adapter';
import { Moment } from 'moment';
import * as moment from 'moment';
@Injectable()
export class MomentUtcDateAdapter extends MomentDateAdapter {
constructor(@Optional() @Inject(MAT_DATE_LOCALE) dateLocale: string) {
super(dateLocale);
}
createDate(year: number, month: number, date: number): Moment {
// Moment.js will create an invalid date if any of the components are out of bounds, but we
// explicitly check each case so we can throw more descriptive errors.
if (month < 0 || month > 11) {
throw Error(
`Invalid month index "${month}". Month index has to be between 0 and 11.`
);
}
if (date < 1) {
throw Error(`Invalid date "${date}". Date has to be greater than 0.`);
}
const result = moment.utc({ year, month, date }).locale(this.locale);
// If the result isn't valid, the date must have been out of bounds for this month.
if (!result.isValid()) {
throw Error(`Invalid date "${date}" for month with index "${month}".`);
}
return result;
}
}接下来，只需将以下提供程序和这个新文件导入到您的app.module或angular材质模块的导入中
@NgModule({
providers: [
{ provide: MAT_DATE_LOCALE, useValue: 'en-GB' },
{ provide: MAT_DATE_FORMATS, useValue: MAT_MOMENT_DATE_FORMATS },
{ provide: DateAdapter, useClass: MomentUtcDateAdapter },
],
imports: [
MomentUtcDateAdapter,
... rest of your imports]https://stackoverflow.com/questions/54735868
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号