Angular 角度4。ngFor和异步问题

我尝试在Angular 4.4中使用异步管道和ngFor指令。 它工作正常，但我在控制台中收到奇怪的错误消息：

错误：找不到类型为“object”的不同支持对象“[object object]”。NgFor仅支持绑定到诸如数组之类的Iterables

导出类事件组件{
事件：可观察；
构造函数（私有eventService:eventService）{
this.events=this.eventService.findAll（）；
}
}

---

请告知

我在Plunker中重现了您的错误：

为了创建错误，我让我的服务方法返回一个对象，而不是预期的数组：

findAll(): Observable<Array<string>> {
  return Observable.of({ data: ['Francis', 'Emilie', 'Diego'] });
}

findAll（）：可观察{
返回可观察的（{数据：[Francis'，Emilie'，Diego']}）；
}

然后，我从组件调用了该方法：

@Component({
  selector: 'my-app',
  template: `
    <div>
      <ul>
        <li *ngFor="let name of names | async">{{ name }}</li>
      </ul>
    </div>
  `,
})
export class App implements OnInit {

  names: string;

  constructor(private eventService: EventService) { }

  ngOnInit(): void {
    this.findAll();
  }

  findAll(): void {
    this.names = this.eventService.findAll();
  }
}

@组件({
选择器：“我的应用程序”，
模板：`

{{name}

`,
})
导出类应用程序实现OnInit{
名称：字符串；
构造函数（私有eventService:eventService）{}
ngOnInit（）：void{
这是findAll（）；
}
findAll（）：void{
this.names=this.eventService.findAll（）；
}
}

我得到了

找不到类型不同的支持对象“[object]” “对象”。NgFor只支持绑定到数组之类的可重用文件

<table>
  <tbody>
  <tr *ngFor="let event of events | async">
  </tr>
  </tbody>
 </table>


export class EventsComponent {

  events: Observable<Array<Event>>;

  constructor(private eventService: EventService) {
      this.events = this.eventService.findAll();
  }
}

---

正如您在帖子下方的评论中所说的，您应该检查findAll方法真正返回的内容。

*ngFor

只迭代数组，不支持迭代对象。您可以使用一个管道，如findAll（）返回的observable实际发出的事件所示，它似乎是对象，而不是数组。检查您从该方法（在运行时）实际返回的内容。好的，findAll方法返回数组的可观察值。所以ngFor实际上显示返回的数据。唯一的问题是控制台中的错误消息。这是findAll函数的签名：findAll（）：Observable{return this.http.get（this._baseUrl）；}签名不相关。TypeScript仅在编译时检查类型。它无法确保后端服务实际返回表示事件数组的JSON。所以它信任你。您需要检查它在运行时实际返回的内容。谢谢您，Arpp。原来我在页面上有两个*ngFor（桌面版和移动版）。Second*ngFor缺少异步管道，因此它被隐藏，但仍引发错误。