Машинопись JSON строку в класс

Question

Позволять это JSON строка:

[ 
    { 
     "id": 1, 
     "text": "Jon Doe" 
    }, 
    { 
     "id": 1, 
     "text": "Pablo Escobar" 
    } 
] 

Пусть будет этот класс:

export class MyObject{ 
    id: number; 
    text: string; 
} 

Как я могу бросить эту JSON строку в списке MyObject?

Если я:

console.log(<MyObject[]>JSON.parse(json_string)); 

возвращает список Object вместо списка MyObject

Answer 1

Вам не обязательно нужен класс здесь. Вы можете просто использовать интерфейс

export interface MyObject{ 
    id: number; 
    text: string; 
} 

Тогда вы можете просто написать:

var myObjArray : MyObject[] = [ 
    { 
    "id": 1, 
    "text": "Jon Doe" 
    }, 
    { 
    "id": 1, 
    "text": "Pablo Escobar" 
    } 
]; 

Если вы данные поступают от сервера, вы, вероятно, в переменной типа любой, и вы можете просто назначьте его массиву этого типа, и он будет работать как ожидалось.

var data: any = getFromServer(); 
var myObjectArray:MyObject[] = data; 

В машинописи вам не нужен класс, реализующий интерфейс. Любой литерал объекта, который удовлетворяет интерфейсу, будет выполнен.

Если ваши данные по-прежнему находятся в строке, вы можете просто использовать JSON.parse(jsonString) для разбора строки на объекты JavaScript.

См площадка here

Answer 2

Вам необходимо будет создать конструктор для класса, и вызвать его для каждого элемента в список вы получаете.

export class MyObject{ 
    constructor(public id: number, public text: string) { } 
} 

let data = [ 
    { 
    "id": 1, 
    "text": "Jon Doe" 
    }, 
    { 
    "id": 1, 
    "text": "Pablo Escobar" 
    } 
]; 

let objects = data.map(o => new MyObject(o.id, o.text)); 

Вы можете проверить его на детской площадке here.

Answer 3

Существует проблема, когда MyObject имеет 50 или более свойств ...

Добавьте конструктор в классе MyObject так, что он расширяет свой объект JSON.

export class MyObject { 
    constructor(json: any) 
    { 
     $.extend(this, json); 
    } 
    id : number; 
    text : string; 

    methodOnMyObject() {...} 
} 

В вашем АЯКС обратный вызов, создать объект MyObject из вашего JSon объекта:

let newObject = new MyObject(json); 
newObject.methodOnMyObject(); 

Я подробно решение в этой post.

Answer 4

Еще один способ для достижения этой цели:

var data: any = getFromServer(); 
var myObjectArray = data as MyObject; 

Или:

var data: any = getFromServer(); 
var myObjectArray = <MyObject>dataMyObject;