Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angular/31.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Angular9:Getting找不到不同的支持对象';[对象对象]';类型为';对象';。NgFor只支持绑定到数组之类的可重用文件_Angular_Typescript - Fatal编程技术网

Angular9:Getting找不到不同的支持对象';[对象对象]';类型为';对象';。NgFor只支持绑定到数组之类的可重用文件

Angular9:Getting找不到不同的支持对象';[对象对象]';类型为';对象';。NgFor只支持绑定到数组之类的可重用文件,angular,typescript,Angular,Typescript,我使用HttpClientModule创建了一个简单的应用程序来调用后端服务,但是数据没有显示在日志中,我执行了以下步骤,使用的是angular-9 你能查一下密码吗 提前谢谢 app.module文件 model.ts 服务台 Servile经过邮递员测试,效果良好 {"response":[{"id":"1","name":"Anand","gender":"Male","email":"a@gmail.com","mobile":"111111111","department":"2","

我使用HttpClientModule创建了一个简单的应用程序来调用后端服务,但是数据没有显示在日志中,我执行了以下步骤,使用的是angular-9

你能查一下密码吗

提前谢谢

  • app.module文件
  • model.ts
  • 服务台
  • Servile经过邮递员测试,效果良好

    {"response":[{"id":"1","name":"Anand","gender":"Male","email":"a@gmail.com","mobile":"111111111","department":"2","isActive":"1","photo":"assets\/images\/emp1.jpg"},{"id":"2","name":"Kiran","gender":"Female","email":"k@gmail.com","mobile":"2222222222","department":"2","isActive":"1","photo":"assets\/images\/emp1.jpg"},{"id":"3","name":"Ravi","gender":"Male","email":"r@gmail.com","mobile":"3333333333","department":"2","isActive":"1","photo":"assets\/images\/emp2.jpg"},{"id":"4","name":"Kumar","gender":"Male","email":"k@gmail.com","mobile":"4444444444","department":"3","isActive":"1","photo":"assets\/images\/emp4.jpg"}]}
    

    看起来问题在于服务器响应是一个对象,而不是一个数组

    //尝试替换
    这个.httpClient.get(…);
    //借
    此.httpClient.get(…).pipe(
    映射(response=>response.response)
    );
    
    this.listEmployee=data.response;
    export class Employee{
        id:number;
        name:string;
        gender:string;
        email? :string; // ? means optional property
        mobile:string;
        department:string;
        isActive:boolean;
        photo? :string;
    }
    
    import {Injectable } from '@angular/core';
    import { Observable } from 'rxjs';
    import {HttpClient} from '@angular/common/http';
    import { Employee } from '../models/employee.model';
    
    @Injectable()
    export class RestAPIServices{
    
        constructor(private httpClient:HttpClient){}
    
       getEmployee():Observable<Employee[]>{
        //this.httpClient.get<Employee[]>("http://127.0.0.1/angularCRUDservices/user/getEmployees").subscribe(res=>  console.log(res));
        return this.httpClient.get<Employee[]>("http://127.0.0.1/angularCRUDservices/user/getEmployees");
       }
    
    }
    
    import { Component } from '@angular/core';
    import {RestAPIServices} from './services/rest-api.service';
    import {Employee} from './models/employee.model';
    
    @Component({
      selector: 'app-root',
      templateUrl: './app.component.html',
      styleUrls: ['./app.component.css']
    })
    export class AppComponent {
    
      listEmployee : Employee[];
      title = 'simple-rest-app';
    
      constructor(private _employeeService:RestAPIServices){}
      ngOnInit(){
    
        this._employeeService.getEmployee().subscribe(
          data=>{
            console.log(data)
            this.listEmployee = data;
          }
        )
    
        console.log(this.listEmployee);
      }
    
    }
    
    {"response":[{"id":"1","name":"Anand","gender":"Male","email":"a@gmail.com","mobile":"111111111","department":"2","isActive":"1","photo":"assets\/images\/emp1.jpg"},{"id":"2","name":"Kiran","gender":"Female","email":"k@gmail.com","mobile":"2222222222","department":"2","isActive":"1","photo":"assets\/images\/emp1.jpg"},{"id":"3","name":"Ravi","gender":"Male","email":"r@gmail.com","mobile":"3333333333","department":"2","isActive":"1","photo":"assets\/images\/emp2.jpg"},{"id":"4","name":"Kumar","gender":"Male","email":"k@gmail.com","mobile":"4444444444","department":"3","isActive":"1","photo":"assets\/images\/emp4.jpg"}]}