2016-12-28 7 views
0

Какова хорошая практика для преобразования реакции (например, данные json) в угловую модель? То есть, другими словами, как достичь функциональности Auto Mapper в угловых 2.Угловая 2 - хорошая практика во время преобразования в угловую модель

team.service.ts

import { Injectable } from '@angular/core'; 
import { Http, Response } from '@angular/http'; 
import 'rxjs/add/operator/toPromise'; 
import { Team } from './team.model'; 

@Injectable() 
export class TeamService { 

    constructor(private _http: Http) { 
    } 

    public GetAllTeams(): Promise<Team[]> { 
    return this._http.get('/app/teams/shared/team.data.json') 
        .toPromise() 
        .then(respons => <Team[]> respons.json().data as Team[]) 
        .then(data => { return data; }); 
    } 
} 

team.data.json

{ 
    "data": [ 
     {"id": "1", "name": "Team 1", "otherProperty" : "S1"}, 
     {"id": "2", "name": "Team 2", "otherProperty" : "S2"},  
    ] 
} 

команда. model.ts

export class Team { 

    private _id: string; 
    public get id(): string { 
    return this._id; 
    } 

    public set id(value: string) { 
    this._id = value; 
    } 

    private _name: string; 
    public get name(): string { 
    return this._name; 
    } 

    public set name(value: string) { 
    this._name = value; 
    } 

    private _icon: string; 
    public get icon(): string { 
    return this._icon; 
    } 

    public set icon(value: string) { 
    this._icon = value; 
    } 

} 

Метод GetAllTeams должен вернуть Team объектов. Я знаю, что я могу создать фабрику, которая получает данные json и возвращает объекты Array of Team, но после прочтения этой статьи https://angular.io/docs/ts/latest/guide/dependency-injection.html (раздел car-factory.ts) кажется, что это плохая модель. Спасибо.

ответ

3

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

export interface Team { 
    id: string; 
    name: string; 
    icon: stirng; 
    someOtherProperty: []; 
} 

Преимущество использования интерфейса является то, что вы получите сильную типизацию, пока нет код, сгенерированный для интерфейса в то время как класс будет генерировать дополнительный код.

То, как вы делаете ответ, теперь я думаю, это хорошо, ИМХО.

public GetAllTeams(): Promise<Team[]> { 
    return this._http.get('/app/teams/shared/team.data.json') 
       .toPromise() 
       .then(respons => respons.json()) 
       .then(x => x.data); 
} 

Всегда помните, что TypeScript - это Javascript + сильный тип. Не пытайтесь задействовать всю реализацию OO (хотя иногда это заманчиво).

+0

Спасибо, используя интерфейс, а не класс в моем случае, кажется, уместным. http://stackoverflow.com/questions/37652801/when-to-use-interface-and-model-in-typescript-angular2 – wolfpack