首页 > 解决方案 > 我无法在角度前端迭代数组

问题描述

我在前端以角度创建了一个数组,该数组具有来自我在 mongoDB 中的数据库的学校中心。问题是当使用 ngFor 我尝试迭代中心数组时。userService我的 api 获取用户。

“找不到类型为‘object’的不同支持对象‘[object Object]’。NgFor 仅支持绑定到 Iterables,例如数组。”

    public centers: Center[];

  constructor(
    private _route: ActivatedRoute,
    private _router: Router,
    private _userService: UserService
  ){
    this.user = new User("","","","","","","","","","","");
    this.title = 'Registrate'
  }

  getCenters(){

    this._userService.getCenters().subscribe(

    //Se guardan los centros en un array para poder acceder a ellos desde la plantilla
    response => {
        this.centers = response;
    },
    err => {
      console.log(err);
    }

  )
  }    

    ngOnInit(){

        this.getCenters();

      }

标签: javascripthtmlnode.jsangulartypescript

解决方案


除了 keyValue 管道(如果您不使用 Angular 6+),您可以通过以下方式获取对象键作为数组

public keys = Object.keys(this.user)

并在模板中遍历这些键并通过键匹配获取原始对象值:

<p *ngFor="let k of keys"> {{user[k]}} </p>

为了完整起见,您的问题是缺少 HTML 片段。我假设社区甚至不知道您希望迭代哪个对象user


推荐阅读