2

将响应(例如 json 数据)转换为角度模型的良好做法是什么?所以,换句话说,如何在 Angular 2 中实现 Auto Mapper 功能。

团队服务.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; });
  }
}

团队.data.json

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

团队模型.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 数据并返回 Team 对象数组的工厂,但是在阅读了这篇文章https://angular.io/docs/ts/latest/guide/dependency-injection.html(部分 car-factory .ts),看来这是不好的模式。谢谢。

4

1 回答 1

4

实际上,如果您需要的是强类型,则不需要创建一个类作为模型。您可以改用接口。

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

使用 Interface 的好处是,您可以在没有为 interface 生成代码的情况下获得强类型化,而 class 将生成额外的代码。

恕我直言,我认为您现在进行响应转换的方式很好。

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 实现引入其中(尽管有时很诱人)。

于 2016-12-28T14:09:03.713 回答