angular2 affiche la liste json imbriquée

Question

Je fais face à une petite chose délicate dans la table modèle angulaire2. J'ai la JSON suivante:

users : 
{ 
     userid : 123, 
     username: 'test', 
     acc : [ 
      { 
       accid: 382746, 
       cyc: [ 
       { 
        cycid: 28734, 
        det: [ 
         { 
          detid: 239876 
         } 
       }, 
       { 
        cycid: 3728, 
        det :[ 
         { 
          detid: 632 
         }, 
         { 
          detid: 2783 
         }  
       }, 
       { 
        cycid: 3729, 
        det :[ 
         { 
          detid: 633 
         }, 
         { 
          detid: 2785 
         }, 
         { 
          detid: 78236 
         } 
        ] 
       } 
     } 
    ] 
} 

Je voudrais afficher dans une liste de table selon la dernière CYC et dernier det du dernier CYC. comme ce qui suit:

--------------------------------------------------------------------- 
|  acc id   |  cyc id   |  det id | 
--------------------------------------------------------------------- 
|  382746   |  3729    |  78236  | 
--------------------------------------------------------------------- 

Toute idée de comment le faire?

Answer 1

utilisez 3 ngFour comme ci-dessous.

<table *ngFor="let acc of users.acc"> 
    <table *ngFor="let cyc of acc.cyc"> 
     <table> 
      <tr *ngFor="let det of cyc.det"> 
      <td></td>//acc.details 
      <td></td>//cyc.details 
      <td></td>//det.details 
      </tr> 
     </table> 
    </table> 
</table> 

Answer 2

Je ne sais pas, cela pourrait-il donner un indice:

<table class="table table-bordered width-150"> 
<tr> 
    <th>accid</th> 
    <th>cycid</th> 
    <th>detid</th> 
</tr> 
<div *ngFor="let user of users; let userIndex = index"> 
    <div *ngFor="let accItem of user.acc ; let accIndex=index"> 
     <div *ngIf="userIndex == 0"> 
      <div *ngFor="let cyc of accItem.cyc ; let cycIndex=index"> 
       <div *ngIf="cycIndex==users[userIndex].acc[accIndex]?.cyc.length-1"> 
        <div *ngFor="let det of cyc.det ; let detIndex=index"> 
         <div *ngIf="detIndex==users[userIndex].acc[accIndex]?.cyc[cycIndex]?.det.length-1"> 
          <tr> 
           <td>{{accItem.accid}}</td> 
           <td>{{cyc.cycid}}</td> 
           <td>{{ det.detid}}</td> 
          </tr> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 
</table>