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.
InformationsquelleAutor Diego Vieira | 2013-11-19
Schreibe einen Kommentar