angular - 如何解决Angular：不可迭代错误

Question

我正在尝试使用 springBoot (BackEnd) 和 Angular(FrontEnd) 从 Mysql 获取 Book 数据，但是每次我收到此错误ERROR TypeError: this.booksRecieved is not iterable，任何人都可以帮助我。

这是我得到错误的函数。

books: Array<Book>;
  booksRecieved: Array<Book>;

refreshData(){
      this.books=new Array<Book>();
      this.httpClientService.getBooks().subscribe(
        (response) =>      
        //get books returned by the api call
        this.booksRecieved = response,
            
      );
      for (const book of this.booksRecieved) {
        const bookwithRetrievedImageField = new Book();
        bookwithRetrievedImageField.id = book.id;
        bookwithRetrievedImageField.name = book.name;
        //populate retrieved image field so that book image can be displayed
        bookwithRetrievedImageField.retrievedImage = 'data:image/jpeg;base64,' + book.picByte;
        bookwithRetrievedImageField.author = book.author;
        bookwithRetrievedImageField.price = book.price;
        bookwithRetrievedImageField.picByte=book.picByte;
        this.books.push(bookwithRetrievedImageField);
}

标签： angulartypescriptspring-boot