geschachtelte Tabelle mit ng-repeat
Was ich versuche zu tun ist, wiederholen Sie die drei Ebenen.
Demo: http://plnkr.co/edit/qXLcPHXDlOKZYI5jnCIp?p=preview
<table>
<thead>
<tr>
<td>Block</td>
<td>Column</td>
<td>Unit</td>
<td>Action</td>
</tr>
</thead>
<tbody ng-repeat="block in building.ownBlock">
<tr ng-repeat="column in block.ownColumn">
<td>{{block.name}}</td>
<td>{{column.number}}</td>
<td>{{unit.name}} - ? empty</td>
<td><button ng-click="edit(unit)">Edit</button></td>
</tr>
</tbody>
</table>
aber ich nicht zu tun.
Sammlung
$scope.building =
{
id: 1,
name: 'first',
ownBlock: [
{
id: 1,
name: 'Block 1',
ownColumn: [
{
id: 1,
number: 'Column 1-1',
ownUnit: [
{
id: 1,
number: 'Unit 1-1-1'
},
{
id: 2,
number: 'Unit 1-1-2'
}
]
},
{
id: 2,
number: 'Column 1-2',
ownUnit: [
{
id: 3,
number: 'Unit 1-2-3'
},
{
id: 4,
number: 'Unit 1-2-4'
}
]
}
]
},
{
id: 2,
name: 'Block 2',
ownColumn: [
{
id: 3,
number: 'Column 2-3',
ownUnit: [
{
id: 5,
number: 'Unit 2-3-5'
},
{
id: 6,
number: 'Unit 2-3-6'
}
]
},
{
id: 4,
number: 'Column 2-4',
ownUnit: [
{
id: 7,
number: 'Unit 2-4-7'
},
{
id: 8,
number: 'Unit 2-4-8'
}
]
}
]
}
]
};
Verwendung von KnockoutJS, die ich verwenden könnte virtuelle Repeater zB.
<!-- ko foreach: items -->
<li data-bind="text: $data"></li>
<!-- /ko -->
Ich codiert eine Richtlinie, sondern " ng-click="Bearbeiten" (st)"' funktioniert einfach nicht.
Vielleicht, weil ich bin mit element.replaceWith(html); ersetzt die Richtlinie HTML.
Jede Hilfe wird sehr geschätzt.
Danke
- Was ist
unit
? - es ist das Kind von ownColumn => ownUnit.
- Das problem ist, dass Sie versuchen zu tun, eine 3d-Darstellung in eine 2d-Tabelle. Da ownUnit ist ein weiterer array, Sie könnte so etwas wie {{Spalte.ownUnit[0].Nummer}}, aber Sie können nicht anzeigen, alle Geräte, ohne etwas anderes zu tun.
Du musst angemeldet sein, um einen Kommentar abzugeben.
Könnten Sie versuchen, etwas wie dies, abhängig von der steady-state-of Ihre Modelle.
werden Sie wollen, verwenden Sie die neue ng-repeat-start-und ng-repeat-end-Richtlinien, die Hinzugefügt wurden, werden in Eckige 1.2. finden Sie die doco für Beispiele.
http://docs.angularjs.org/api/ng.directive:ngRepeat