2
Answers

Print table using two ngFor loop

Mandar Shinde

Mandar Shinde
5y
2.4k
1
Dear all,
 
Hope you are doing well. I was developing one component using Angular 7 and ASP .net MVC with REST api. Table code :-
  1. <table class="table">      
  2.    <tr>      
  3.      <th>#</th>      
  4.      <th>Game</th>      
  5.      <th>Platform</th>       
  6.       <th>Release</th>      
  7.     </tr>      
  8.      <tr *ngFor="let game of games; let i = index">      
  9.           <td>{{i + 1}}</td>      
  10.           <td>{{game.game}}</td>      
  11.           <td>{{game.platform}}</td>      
  12.           <td>{{game.release}}</td>      
  13.       </tr>      
  14. </table>  
How can I print this data more dynamically l mean if I have get headers which I want am bringing from database.
 
what I have tried is that :-
  1. <table class="table">        
  2.    <tr>        
  3.      <th>#</th>        
  4.      <th *ngFor="let header of headers;">    
  5.          {{ header['HeaderName'] }}    
  6.      </th>    
  7.     </tr>        
  8.      <tr *ngFor="let game of games; let i = index">        
  9.           <td>{{i + 1}}</td>        
  10.           <td>{{game[i][header]}}</td>    
  11.       </tr>        
  12. </table>  
Here I am able to see table headers only not table data.
 
How can I overcome on above problem.
 
Thanking you in advance.
Regards.
Answers (2)
Next Recommended Forum