在Typescript接口中的日期实际上是检查时的字符串

时间:2016-10-07 21:05:08

标签: javascript angular typescript

不幸的是,重现这一点的总代码将是广泛的,所以我希望我的问题很明显,我可以很容易地提供。如果需要,我会发布更完整的解决方案。

首先,我正在定义一个接口:

export interface ITest {
    myDate: Date;
}

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

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

我使用Angular2中的服务公开这些服务,该服务从angular2-in-memory-web-api访问InMemoryDbService。我调用它并获取数组的代码如下:

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

...然后我将它带到我的组件中:

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

这一切都运行正常,但问题是显示的console.log语句导致:

Date Type:string

其中的数据是正确的,因为我的日期所持的字符串是1995-09-01T07:00:00.000Z,但主要问题是 - 它不是Date它是string !在VS Code中,我甚至可以获得toDateString等方法的代码完成,但是当我执行它们时,我(当然)得到toDateString is not a function

我很确定问题出现在response => response.json().data as ITest[],但为什么不将日期数据转换为实际的Date?我明白了,我做错了。我应该如何处理这个问题,以便我可以让我的对象获得我期望的类型?

1 个答案:

答案 0 :(得分:7)

您正在使用接口和type assertion基本上告诉TypeScript该对象符合该接口。

但事实并非如此,因为你所投射的是一个json对象,其中“myDate”属性被表示为字符串。

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

它作为字符串的原因是没有用JSON格式定义的类型来表示Date,所以服务器很可能只是发送date.toString()的结果。

您可以选择一个用于表示返回值的类,并从JSON属性中实例化一个对象,如下所示:

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);