Angular JS - Wie das hinzufügen von zusätzlichen DIV-in ng-repeat

Ich habe ein array a=[1,2,3,4,5,6].

Mit ng-repeat auf dieses array, ich bin 6 divs.

Finden Sie auf dieser plunker

Gibt es eine Möglichkeit, eine weitere hinzufügen div nach jeder Zeile. So nach 3 divs möchte ich hinzufügen, dass eine extra div.

Schaute ich in diesem Beispiel. aber Sie sind ein Kind div. ist es möglich, erstellen Sie ein Geschwisterchen div in ng-repeat

InformationsquelleAutor Aditya Ponkshe | 2014-04-07
  1. 8

    Wir versuchen die ng-repeat-start & ng-repeat-end.

    <div class="example-animate-container">
  <div class="square" ng-repeat-start="friend in a">
   {{$index}}
  </div>
  <div ng-if="$index % 3 == 2" ng-repeat-end>
    extra div
  </div>
</div>

    Bitte beachten Sie, dass die ng-repeat-start-Anweisung enthalten ist, da eckige 1.2.1.

    plnkr demo

    ng-repeat: wiederholen Sie eine Reihe von Elementen für "eins" übergeordneten element

    <!--====repeater range=====-->
  <Any ng-repeat="friend in friends">
  </Any>
<!--====end of repeater range=====-->

    ng-repeat-start & ng-repeat-Ende: mit ng-repeat-start-und ng-repeat-end definieren Sie den Startpunkt und Endpunkt des erweiterten repeater range

    <!--====repeater range start from here=====-->
<Any ng-repeat="friend in friends" ng-repeat-start> 
  {{friend.name}}
</Any><!-- ng-repeat element is not the end point of repeating range anymore-->

<!--Still in the repeater range-->
<h1>{{friend.name}}</h1>

<!--HTML tag with "ng-repeat-end" directive define the end point of range -->
<footer ng-repeat-end>
</footer>
<!--====end of repeater range=====-->
    • Vielen Dank Mann Ihr code funktioniert wie ein Charme!
    • Können Sie bitte erklären, wie ng-repeat-start und ng-repear-end funktioniert?
    • Antwort aktualisiert. Hoffe, das wird helfen.
    • +1 für diesen einen, aber ich denke, dein zweites Beispiel mit ng-repeat-startist falsch. Wo haben Sie <Any ng-repeat="friend in friends" ng-repeat-start> sollte <Any ng-repeat-start="friend in friends"> statt. Es hat nicht funktioniert für mich anders.
    InformationsquelleAutor Chickenrice
  2. 1

    Den ng-repeat-start und ng-repeat-end syntax eingeführt wurde, für genau diesen Zweck. Finden Sie in der Dokumentation http://docs.angularjs.org/api/ng/directive/ngRepeat

    Du wirst So etwas wie:

    <div ng-init="a = [1,2,3,4,5,6]">

<div class="example-animate-container">
  <div class="square" ng-repeat-start="friend in a">
   {{$index}}
  </div>
  <div ng-repeat-end>Footer</div>
</div>
    InformationsquelleAutor Beyers
  3. 0

    Können Sie ein leeres div als container für Ihre Wiederholung. Und dann nur render das untergeordnete element als Quadrate (oder was immer Sie wollen). Auf diese Weise werden Ihre extra div-Element ein Geschwister und nicht ein Kind.

    Siehe mein Beispiel: http://plnkr.co/edit/xnPHbwIuSQ3TOKFgrMLS?p=preview

    InformationsquelleAutor Linksonder
  4. 0

    werfen Sie einen Blick auf diese plunker hier, könnte es sein, Ihre Lösung? ich verstehe nicht wirklich gut dein problem, weil ich denke, es ist besser, wenn die Instanz Ihre array in einer externen js-Datei, aber andere als, dass, nehmen Sie einen Blick hier plunker

    InformationsquelleAutor mautrok
Schreibe einen Kommentar