如何在'ng-repeated divs'中重複孩子？

-2

我想創建一個包含子項目的項目列表。的項目和子項在數組中列出這樣的：如何在'ng-repeated divs'中重複孩子？

items=[firstItem,secondItem,thirdItem,...]

和

subitems=[{"name":"firstSubitem1","name":"secondSubitem1",...},{"name":"firstSubItem2","name":"secondSubItem2"},...]

所以我已經建立了這個網站碼：

<body> 
    <div ng-app="" ng-init="items=[firstItem,secondItem,thirdItem,...],subitems=[{"name":"firstSubitem1","name":"secondSubitem1",...},{"name":"firstSubItem2","name":"secondSubItem2"},...]"> 
     <div ng-repeat="itemNames in items" id="item{{$index}}">{{itemNames}}</div> 
    </div> 
</body>

但是，只有輸出列表如果項目，並且我想列出項目（divs）有子項目（段落）。所以我想創建的輸出是這樣的：

<body> 
    <div (...) id="item0"> 
     firstItem 
     <p>firstSubitem1</p> 
     <p>secondSubitem1</p> 
     <p>...</p> 
    </div> 

    <div (...) id="item1"> 
     secondItem 
     <p>firstSubitem2</p> 
     <p>...</p> 
    </div> 

    <div (...) id="item2"> 
     ... 
    </div> 
</body>

那麼我怎樣才能使它成爲輸出？

來源

2017-04-09 Sacha

中的對象'subitem'數組不是有效的JavaScript。對象是'key：value'對的列表。 – georgeawg

@georgeawg謝謝我將在 – Sacha

這個問題中改變這個問題，任何人都可以在沒有更多細節的情況下回答這個問題，因此沒有顯示將子項目與父項目相匹配的關係。花一些時間閱讀[ask] – charlietfl

您需要調整您的數據如下：

items = [{ 
    title: firstItem, 
    subitems: [firstSubitem1, secondSubitem1, ...] 
}, { 
    title: secondItem, 
    subitems: [firstSubitem2, secondSubitem2, ...] 
}....]

和HTML如下：

<div ng-repeat="item in items" id="item.title{{$index}}">{{item.title}} 
    <p ng-repeat="subitem in item.subitems">{{subitem}}</p> 
</div>

來源

2017-04-09 18:08:11 pranavjindal999

假設OP可以重構源代碼。也可以在本地進行映射 – charlietfl

它就像一個魅力！謝謝！ – Sacha

如果你堅持你的數據結構，從外循環使用$指數：

<body> 
<div ng-app="" ng-init="items=[firstItem,secondItem,thirdItem,...],subitems=[{firstSubitem1,secondSubitem1,...},{firstSubItem2,secondSubItem2},...]"> 
    <div ng-repeat="itemNames in items" id="item{{$index}}"> 
     {{itemNames}} 
     <p data-ng-repeat="(key, value) in subitems[$index]"> {{ value }}</p> 
    </div> 
</div>

來源

2017-04-09 18:09:52 dev8080

如何在'ng-repeated divs'中重複孩子？

回答

相關問題