如何在angular中使用ngFor绑定数据

Question

I am new to angular. Just learning it. I want to bind data with ngFor. but its not showing any data. Kindly help me to solve this

html file :

 <tbody class="text-center">
          <tr *ngFor="let agent of agentlist ;let i = index">
              <td>{{i + 1 + paginationObject?.page * paginationObject?.itemPerPage}}</td>-->
              <td>{{agent?.id?agent?.id:''}}</td>
          </tr>
        </tbody>

error : <!--bindings={ "ng-reflect-ng-for-of": null }-->

Answer 1

Try removing the --> at the end of the first table cell and correct the binding on the second one.

<tbody class="text-center">
  <tr *ngFor="let agent of agentlist ;let i = index">
      <td>{{i + 1 + paginationObject?.page * paginationObject?.itemPerPage}}</td>-->
      <td>{{agent?.id}}</td>
  </tr>
</tbody>

Also, you need to make sure that agentlist has something to iterate. maybe putting a console.log(agentlist) and see what it has inside of it in the ts class. If angelist is only declared but never defined you will get that error. Initialize angelist as an empty array to make sure that have an iterable before defining with the final data.