Wil*_*lyC 6 javascript typescript angular
不幸的是,重现这一点的总代码将是广泛的,所以我希望我的问题很明显,我可以很容易地提供.如果需要,我会发布更完整的解决方案.
首先,我定义了一个接口:
export interface ITest {
myDate: Date;
}
Run Code Online (Sandbox Code Playgroud)
然后我创建一个这样的数组用于测试:
export const TEST: ITest[]=[{myDate: new Date(1995, 8, 1)}]
Run Code Online (Sandbox Code Playgroud)
我使用Angular2中的一个服务来暴露这些服务,该服务正在攻击InMemoryDbService angular2-in-memory-web-api
.我调用它并获取数组的代码如下:
get(): Promise<ITest[]>{
return this.http.get(this.testUrl)
.toPromise()
.then(response => response.json().data as ITest[])
.catch(this.handleError);
}
Run Code Online (Sandbox Code Playgroud)
...然后我把它带到我的组件中:
this.testService.get().then(tests => {
this.tests = tests;
console.log("Date Type:"+typeof(this.tests[0].myDate));
});
Run Code Online (Sandbox Code Playgroud)
这一切都很好,但问题是console.log
显示的结果如下:
Date Type:string
Run Code Online (Sandbox Code Playgroud)
其中的数据是正确的,因为我的日期所持有的字符串是1995-09-01T07:00:00.000Z
,但主要问题是 - 它不是Date
一个string
!在VS Code中,我甚至可以获得方法的代码完成,toDateString
但是当我执行它们时,我(当然)得到了toDateString is not a function
.
我很确定问题正在发生response => response.json().data as ITest[]
,但为什么不将日期数据转换为实际Date
?我做错了,我明白了.我应该如何处理这个问题,以便我可以让我的对象获得我期望的类型?
您正在使用接口并键入断言,以基本告诉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);
Run Code Online (Sandbox Code Playgroud)