Question

我是Angular 2的新手。我正在尝试从web api获取一些数据，我可以看到在角度2调用后数据正确填充。我的问题是映射并没有像我预期的那样工作。

在我的Angular服务中，我有：

getEmployees() {
    return this._http.get(this._employeeUrl)
        .map(res => <Employee[]>res.json())
        .catch(this.handleError);
}

在我的角色组件中，我有：

   public EmployeeList : Employee[];

    getEmployees() {
        this._employeeService.getEmployees()
            .subscribe(
            value => {
                this.EmployeeList = value
            },
            error => this.errorMessage = <any>error);
    }

和

export interface Employee{
    Id: number,
    FirstName: string,
    Phone: string
}

当我调试时，我可以看到它从web api中提取数据，例如：

对象{id：10，firstName：＆＃34; Arash＆＃34;，电话：＆＃34; 11212121＆＃34;}

但是它没有将对象转换为EmployeeList，即当我尝试做类似EmployeeList.FirstName的事情时，它说它未定义。我注意到，如果我定义了EmployeeList，如：

public EmployeeList = [];

结果是一样的，所以我认为映射并不像我预期的那样工作。

任何人都可以帮助解决问题。

Answer 1

转换为界面只是用于对代码进行静态分析的工具的信息。它不会改变您的应用程序的行为。接口只是在运行时删除。

您应该创建一个实现该接口的类，如

class MyEmployee implements Employee {
  constructor(public Id:number, public Firstname:string, publich Phone:string){}
}

并像

一样使用它

.map(res => res.json.map(e => new MyEmployee(e.id, e.firstName, e.phone))

为什么不在Angular 2中映射来自Web API的数据

1 个答案: