我无法在角度前端迭代数组答案

【问题标题】：I can't iterate array in angular front end我无法在角度前端迭代数组
【发布时间】：2019-03-25 10:09:55
【问题描述】：

我在 Angular 前端创建了一个数组，该数组具有来自我在 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();

      }

【问题讨论】：

您要迭代的对象不是数组
是的，你能评论HTML循环和console.log那个变量吗？
response 可能是 HttpResponse 对象，而不是您期望的数据。没有看到UserService的getCenters方法，很难说。
Angular: Cannot find a differ supporting object, [object Object]

标签： javascript html node.js angular typescript

【解决方案1】：

除了 keyValue 管道（如果你没有使用 Angular 6+），你可以通过数组获取对象键

public keys = Object.keys(this.user)

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

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

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

【讨论】：

【解决方案2】：

在 Angular 6 中，要迭代一个对象，您可以使用键值管道

<div *ngFor="let usr of user | keyvalue">
  {{usr.key}}:{{usr.value}}
</div>

【讨论】：

问题是他试图迭代的数组不是数组，正如他的问题所说，它是一个对象。所以他必须知道用户变量的内容是什么。