错误：找不到“object”类型的不同支持对象“[object Object]”。 NgFor 只支持绑定到 Arrays 等 Iterables 如何解决

Question

返回json数据的服务代码

  export class EmployeeServiceService {
      constructor(private _http:Http) { }
      GetEmployees() :Observable<IEmployee[]>{
        debugger;
        return this._http.get("http://localhost:2724/api/employee/1")
        .map((response:Response)=> <IEmployee[]>response.json())
      }
    }

在这个组件类中我无法转换 json 数据请任何人帮我解决我的问题

export class EmployeeListComponent implements OnInit {

  Employees:IEmployee[];

      constructor( private _EmployeeService: EmployeeServiceService) { 

      }

      ngOnInit() {
       this._EmployeeService
        .GetEmployees().subscribe((employeeData)=> this.Employees = employeeData);
      }

    }

html

<tbody>
  <tr *ngFor="let employee of Employees">
    <td>{{employee.Address}}</td>
    <td>{{employee.City}}</td>
    <td>{{employee.EmployeeID}}</td>
    <td>{{employee.FirstName}}</td>
    <td>{{employee.LastName}}</td>
  </tr>
  <tr *ngIf="!Employees|| Employees.length== 0">
    <td>No employee to display!!!</td>
  </tr>
</tbody>

在此处输入代码

Answer 1

当您尝试将对象与 ngFor 绑定时，就会发生此错误。 ngFor 指令仅支持数组。

根据请求，它似乎只返回一个对象，

 return this._http.get("http://localhost:2724/api/employee/1")

如果您只需要绑定一个Object，则无需使用ngFor。

您还需要使用空数组初始化员工。

Employees:IEmployee[] = [];

如果你还想绑定一个Object到table上，可以如下push这个Object到数组中，

this.Employees.push(employeeData);

两种选择

(i) 更改您返回所有员工的请求

 return this._http.get("http://localhost:2724/api/employee/all")

(ii) 如下将 Object 推送到数组中，

ngOnInit() {
       this._EmployeeService
        .GetEmployees().subscribe((employeeData)=> this.Employees.push(employeeData);
      }