angular - 'value' 应该是 Kendo Angular DatePicker 中有效的 JavaScript Date 实例

Question

kendo DatePicker 的绑定(bind)出现错误。

The 'value' should be a valid JavaScript Date instance

我在 asp core 中获取学生的 Web api 是:

    [HttpGet, Route("/api/master/{id}")]
    public JsonResult GetStudentById(int id)
    {
        return Json(new { id = 1, RegisterDate = DateTime.Now });
    }

它返回:

{"id":1,"registerDate":"2018-05-01T13:23:35.1229748+04:30"}

最后在我的 Angular 分量中是:

student: Student = new Student();
constructor() { }

ngOnInit() {
   this.http
       .get(`http://localhost:58824/api/master/${10}`, { headers: this.setHeader() })
       .subscribe(response => { this.student = response; });
}

查看:

<form novalidate #form="ngForm" (submit)="save(form)">
   <label for="birthDate">Date</label>
   <kendo-datepicker [format]="'dd-MM-yyyy'" name="registerDate" [(ngModel)]="student.registerDate"></kendo-datepicker>
</form>

有一个错误: “值”应该是有效的 JavaScript Date 实例

不用说，我已将 DateInputsModule 添加到 app.module 中的导入数组中 我该如何修复它？

Answer 1

此配置从序列化数据中删除时区 (+04:30):

services.AddMvc()  
       .AddJsonOptions(options =>  
       {  
         options.SerializerSettings.DateTimeZoneHandling = DateTimeZoneHandling.Unspecified;  // Treat as a local time if a DateTime is being converted to a string.
       });  

或者尝试以这种方式指定 DateTimeFormat，并通过将 DateTimeStyles 设置为 AdjustToUniversal 使其自动将日期调整为 UTC:

services.AddMvc()
    .AddJsonOptions(options =>
    {
        var settings = options.SerializerSettings;
        var dateConverter = new IsoDateTimeConverter
        {
            DateTimeStyles = DateTimeStyles.AdjustToUniversal,
            DateTimeFormat = "yyyy'-'MM'-'dd'T'HH':'mm':'ssK"
        };
        settings.Converters.Add(dateConverter);
    });