angular2顯示嵌套的json列表

我在angular2模板表中面對一個棘手的問題。我有以下的JSON：angular2顯示嵌套的json列表

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 
         } 
        ] 
       } 
     } 
    ] 
}

而且我想在過去的CYC最後CYC在最後DET的ACC表列表中顯示。如下：

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

任何想法如何做到這一點？

來源

2017-06-22 K Oul

可以請你描述一下是對象之間的關係，以及我們如何在這個問題 –

廣泛映射位示例代碼片段中的括號不匹配。這很難解釋數據結構。你能想出一個小JSFiddle或更正數據結構片段嗎？ – nipuna777

Json已更新 –

使用3 ngFor如下所示。

<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>

來源

2017-06-22 09:10:29

我不知道，也許這給一些線索：

<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>

來源

2017-06-22 09:22:22

它不僅會給出cyc的最後一個和det的最後一個。但它會給所有人 –

是的：你只想要最後一個？ –

事實上，我剛剛只需要一個ACC比肩甚至行行政協調會多CYC和CYC已多次DET只在最後一CYC和DET應顯示 –

angular2顯示嵌套的json列表

回答

相關問題