当检查时，Typescript界面​​中的日期实际上是字符串 [英] Dates in a Typescript interface are actually strings when inspected

问题描述

不幸的是，要重现此代码的总代码量很大，所以我希望我的问题在我可以轻松提供的内容上很明显.如果需要，我将发布更完整的解决方案.

Unfortunately the total code to reproduce this would be extensive, so I'm hoping that my problem is obvious with what I can easily provide. If required, I'll post a more complete solution.

首先，我要定义一个接口:

First, I am defining an interface:

export interface ITest {
    myDate: Date;
}

然后我创建一个用于测试的数组:

Then I create an array of these for testing:

export const TEST: ITest[]=[{myDate: new Date(1995, 8, 1)}]

我使用Angular2中的服务公开了这些内容，该服务从angular2-in-memory-web-api中命中了InMemoryDbService.我调用此代码并获取数组的代码如下:

I expose these using a service in Angular2 that is hitting the InMemoryDbService from angular2-in-memory-web-api. The code where I call this and get the array is as follows:

get(): Promise<ITest[]>{
    return this.http.get(this.testUrl)
        .toPromise()
        .then(response => response.json().data as ITest[])
        .catch(this.handleError);
}

...然后我将其带入组件:

...and then I bring it into my component with:

    this.testService.get().then(tests => {
        this.tests = tests;
        console.log("Date Type:"+typeof(this.tests[0].myDate));
    });

这一切都很好，但是问题是其中显示的console.log语句导致:

This all works fine, but the problem is the console.log statement shown there results in:

Date Type:string

其中的数据是正确的，因为我的约会所保存的字符串是1995-09-01T07:00:00.000Z，但是主要的问题是-它不是Date而是string！在VS Code中，我什至可以得到toDateString之类的方法的代码完成，但是当我执行它们时，(当然)我会得到toDateString is not a function.

The data in it is correct, in that the string held by my date is 1995-09-01T07:00:00.000Z, but the main issue is - it isn't a Date it is a string! In VS Code I even get code completion for methods like toDateString but when I execute them I (of course) get toDateString is not a function.

我很确定问题出在response => response.json().data as ITest[]上，但是为什么日期数据没有投射到实际的Date上呢?据我所知，我做错了.我应该如何处理以便我的对象能够获得期望的类型?

I am pretty sure that the issue is occurring with response => response.json().data as ITest[], but why isn't the date data being cast to an actual Date? I'm doing it wrong, that I understand. How should I be handling this such that I can have my objects obtain the types I expect?

推荐答案

您正在使用界面和类型断言来基本上告诉TypeScript对象符合该接口.

You are using an interface and type assertion to basically tell TypeScript that the object conforms to that interface.

但是实际情况并非如此，因为您要投射的是一个json对象，其中"myDate"属性表示为字符串.

But this is not actually the case as what you are casting is a json object in which the "myDate" property is being represented as a string.

使用类型声明不会以任何方式影响生成的javascript代码-您必须自己进行实际的类型转换.

Using type-assertion does not affect generated javascript code in any way - you have to do the actual type conversion yourself.

之所以以字符串形式出现，是因为没有以JSON格式定义的类型来表示Date，因此服务器很可能只是发送date.toString()的结果.

The reason why it comes as string is that there is no type defined in JSON format to represent Date, so the server in all likelihood is just sending a result of date.toString().

您的一个选择是拥有一个用于表示返回值的类，并从JSON属性实例化一个对象，如下所示:

One option for you would be to have a class for representing the returned value and instantiate an object from the JSON properties like so:

var response = JSON.parse(JSON.stringify({ myDate: new Date() }));

class Test  {
    constructor(json: { myDate: string }) {

        this.myDate = new Date(json.myDate);
    }

    myDate: Date;
}

let test = new Test(response);
console.log("Type: " + typeof (test.myDate));
console.log("Value: " + test.myDate);

这篇关于当检查时，Typescript界面​​中的日期实际上是字符串的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！