錯誤類型錯誤：this.userList 不可迭代

Question

我一直在尋找類似的問題，但不明白我的問題是什么。 我是Angular的菜鳥。

我打電話給service.getUsers() 。 並成功獲取數據。 但是我注意到在調試代碼時this.userList是undefined的（如圖所示）。 我的問題是我無法迭代userList它說ERROR TypeError: this.userList is not iterable

但是在 HTML 上，我使用userList作為表的資源。 我可以看到我從 DB 獲得的數據。 那么，如果數據未定義且不可迭代，我將如何查看該數據？ 我需要在同一個 class 中使用userList循環。

this.service.getUsers().subscribe(data => { this.userList = data; });

testFunction() {
  for (let user of this.userList) {
    this.selectedUserList.push(user);
  }
}

Answer 1

謝謝大家。 我想到了。

this.service.getUsers().subscribe(data=>{this.userList=data; console.log(data); this.testFunction();});

我在訂閱中調用了 function 工作正常。

Answer 2

如果您在訂閱數據后調用 testFunction()，那么您不會將 this.userList 設為未定義。 但否則你會的。

這是因為 getUsers() 返回一個 observable，（因為你訂閱了它）並且 observables 是異步的。 因此，當 getUsers() 完成執行並返回數據時，該數據又被分配給 this.userList，控件已經到達 testFunction()。 由於之前的 function 還沒有返回，所以變量 this.userList 肯定是 undefined。

this.service.getUsers().subscribe(data => {
  this.userList = data;
  this.testFunction();
});


testFunction() {
  for (let user of this.userList) {
    this.selectedUserList.push(user);
  }
}