ng-repeat innerhalb von ng-repeat mit td für jedes Element - AngularJS

Dieser code gibt mir eine Tabelle mit den Elementen in einer einzelnen Spalte.

Hier werden Daten wie diese

var data = [[{"id":"1","value":"One"},{"id":"2","value":"Two"},{"id":"3","value":"three"}],[{"id":"4","value":"four"},{"id":"5","value":"five"},{"id":"6","value":"six"}],[{"id":"7","value":"seven"},{"id":"8","value":"eigth"},{"id":"9","value":"nine"}]]

<div id="mydiv">
    <table>
       <tr ng-repeat="rows in data">
           <td ng-repeat="item in rows">{{item.id}}:{{item.value}}</td>
        </tr>
    </table>
</div>

Dieser gibt mir eine Tabelle mit drei Spalten. Wie

1:One 2:Two 3:three
4:four 5:five 6:six
7:seven . . .

Zusammen mit diesem möchte ich die Tabelle mit item.id in einer Spalte : in einer Spalte und item.value in einer Spalte für eine bessere Lesbarkeit und nicht in einer einzelnen Spalte.

Versucht, das zu tun, aber ich bin nicht in der Lage, um es arbeiten, kann mir jemand helfen mit diesem?

  • Nur um zu überprüfen, ob mein Verständnis korrekt ist - es gibt drei Elemente in jeder Zeile, richtig?
  • Also, was ist data?
  • Ja @TadeášPeták
  • Ich aktualisiert meine Frage mit Daten @dev-null
InformationsquelleAutor kumareloaded | 2015-04-14
  1. 29

    Definieren Sie Ihre Tabelle so:

    <div id="mydiv">
    <table>
        <tr ng-repeat="rows in data">
            <td ng-repeat-start="item in rows">{{item.id}}</td>
            <td>:</td>
            <td ng-repeat-end>{{item.value}}</td>
        </tr>
    </table>
</div>

    Weitere Informationen finden Sie in der Spezielle wiederholen Sie die start-und end-Punkte - Abschnitt der ngRepeat-Dokumentation:

    Zum wiederholen einer Reihe von Elementen statt nur einem übergeordneten element, ngRepeat (wie auch die anderen ng-Richtlinien) unterstützt die Ausweitung der Reichweite des Repeaters durch die Definition von expliziten start-und end-Punkte durch die Verwendung von ng-repeat-start-und ng-repeat-end-bzw. Die ng-repeat-start-Anweisung funktioniert genauso wie ng-repeat, sondern wiederholen alle den HTML-code (einschließlich der tag-es definiert) bis zu und einschließlich der Beendigung HTML-tag, wo die ng-repeat-end gelegt wird.

    • Perfekt! Danke 🙂
    • Hältst du diese Antwort wird die korrekte Antwort auf deine Frage ? Wenn ja, können Sie markieren Sie es als die richtige Antwort, um anderen zu helfen, wenn Sie deine Frage Lesen ?
    • Und was ist, wenn einige der Zeilen nicht die Elemente in ihm ? Im Grunde genommen habe ich diese Tabelle enthält bestimmte Kategorien. Einige von Ihnen haben Unterkategorien, einige nicht. Wie könnte ich den code in mein html ? Wie für die Struktur der array-I-Schleife, es sieht wie folgt aus : {name : 'name_category' Unterkategorien:{}} Offensichtlich einige der Objekte haben, die Unterkategorien-array leer
    InformationsquelleAutor Timothée Jeannin
Schreibe einen Kommentar