可观察到的地图不会转换为打字稿类 [英] Observable Map does not cast to typescript class

问题描述

我正在使用角度2，并且试图调用端点以返回对象集合.

我有以下TypesScript类

export class Route
{
    public branchId: number;
    public branch: string;
    public isTest: boolean = true;
}

我有一个api端点，该端点返回以下Json

[{"id":610,"branch":"Coventry"},{"id":620,"branch":"Shoreham"}]

我有一个路由服务，该服务使用以下代码调用端点

public getRoutes(): Observable<Route[]>
{
    const url = 'http://localhost/routes';

    return this.http.get(url)
        .map((response: Response) =>
        {
            const routes: Route[] = response.json() as Route[];
            if (routes.length > 0) {
                console.log(routes[0].isTest);
                //This returns undefined I was expecting the boolean value true
            }
            return routes;

        }
        )
        .catch(e => this.httpErrorService.handleError(e));
}

似乎没有将response.json()强制转换为数据类型Route.为什么是这样?

解决方案

您不能像在TypeScript中那样进行严格的转换，而使对象成为该类型.强制转换只是一个转译技巧，可以告诉其余代码您正在使用Route数组.要真正获取json数据的类型为Route而不只是Object，您可以使用assign方法像这样键入它们:

 const routes: Route[] = (response.json() as []).map((obj) => {
     return Object.assign(new Route(), obj);
}) as Route[];
 

如果json数据确实设置了所有属性，则无需使用assign方法，因为此时您正在针对接口进行开发，该接口应像使用类型对象一样工作./p>

I am using angular 2 and I am trying to call an endpoint to return a collection of objects.

I have the following TypesScript class

export class Route
{
    public branchId: number;
    public branch: string;
    public isTest: boolean = true;
}

I have a api endpoint which returns the following Json

[{"id":610,"branch":"Coventry"},{"id":620,"branch":"Shoreham"}]

I have a route service which calls the endpoint using the following code

public getRoutes(): Observable<Route[]>
{
    const url = 'http://localhost/routes';

    return this.http.get(url)
        .map((response: Response) =>
        {
            const routes: Route[] = response.json() as Route[];
            if (routes.length > 0) {
                console.log(routes[0].isTest);
                //This returns undefined I was expecting the boolean value true
            }
            return routes;

        }
        )
        .catch(e => this.httpErrorService.handleError(e));
}

It appears that the response.json() is not being cast to data type Route. Why is this?

解决方案

You cannot do a strict cast like that in TypeScript and have the objects become that type. The cast is simply a transpiler trick to tell the rest of your code that you are working with a Route array. To truly get the json data to be of type Route and not just Object you can use the assign method to type them like so:

const routes: Route[] = (response.json() as []).map((obj) => {
     return Object.assign(new Route(), obj);
}) as Route[];

If the json data does have all of the properties set then there is no need to use the assign method because at that point you are developing against an interface which should work as if you were working with the typed object.

这篇关于可观察到的地图不会转换为打字稿类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！