PKPrabu
PKPrabu

Reputation: 507

Angular - Iterate over on response object from Google Books API

Hello I'm new to angular and i'm working on Google Books API. Here I get object as response. As I'm new, I have no idea how to handle the object and display those on the screen. Please help me to fix this. Thank you. Please look at the console in the example. Stackblitz Example

Upvotes: 0

Views: 83

Answers (1)

vicpermir
vicpermir

Reputation: 3702

Without changing anything in your typescript code, you can just iterate over the items property of your response and display any info you need.

Quick example (app.component.html):

<div class="row">
  <table class="table table-hover table-striped">
    <thead>
      <tr>
        <th>Country</th>
        <th>title</th>
        <th>Publication Date</th>
      </tr>
    </thead>
    <tbody>
      <tr *ngFor="let book of books.items">
        <td>{{book.accessInfo.country}}</td>
        <td>{{book.volumeInfo.title}}</td>
        <td>{{book.volumeInfo.publishedDate}}</td>
      </tr>
    </tbody>
  </table>
</div>

Here is a Stackblitz with the changes.

Upvotes: 2

Related Questions