使用打字稿将对象投射到模型

时间:2019-02-24 05:43:34

标签: javascript angular typescript

在下面的示例中,我有一个像lst的json,我想将其映射到MyModel

interface MyModel { 
    id: number;
    isRequired : boolean;
    ,...
}

let lstByModel: Array<MyModel> = [];

// lst comes from API
let lst:any[] = [
    {
        "id":"10",
        "isRequired":"false"        
    }
];

lstByModel = lst; // How to map lst to MyModel (lstByModel)?

console.log(lstByModel); // it shows { id : "10" , isRequired : "false"} but I need { id : 10, isRequired : false } How can I do that?

提前谢谢。

4 个答案:

答案 0 :(得分:1)

您可以使用Object.assign()

  

Object.assign()方法用于将所有可枚举的自身属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。

答案 1 :(得分:1)

Typescript中的

typesiterfaces仅是编译时。因此,您的lst不会自动转换为其他type

您需要手动将字符串映射到数字。就您而言

lstByModel = lst.map(lstItem=>{
    return {
         id:parseInt(lstItem.id), // manually changing string to number
        isRequired: lstItem.isRequired=="true" //parsing boolean
    }
})

答案 2 :(得分:0)

let lst:any[] = [ { "id":"10", "isRequired":"false" } ]; 

如json格式所示, id isRequired 字段是字符串类型。

因此,您需要做的是,使用foreach循环将 id 转换为数字,将 isRequired 转换为boolen。

答案 3 :(得分:0)

如果您可以将类用于模型而不是接口,则可以使用Object.assign()模式。也是其他与api或io相关的翻译/功能的好模式。

abstract class ApiLoadable {
 static fromObject<T extends ApiLoadable>(this: { new(): T }, obj: object): T {
   return Object.assign(new this(), obj);
 }
}

class MyModel extends ApiLoadable {
  id: number;
  isRequired : boolean;
}

const json = `{ "id": 10, "isRequired": false }`;
const model = MyModel.fromObject(JSON.parse(json));

请注意,静态方法中存在一些'this'参数欺骗行为–这使静态方法始终可以基于关于该主题的this question创建正确的子类实​​例