Möglichkeit, ng-repeat eine festgelegte Anzahl von Malen zu wiederholen, anstatt über ein Array zu wiederholen?

Question

Gibt es eine Möglichkeit, eine definierte Anzahl von Malen ng-repeat anstatt immer über ein Array zu iterieren?

Zum Beispiel möchte ich unten, dass das Listenobjekt 5 Mal angezeigt wird, wobei $scope.number gleich 5 ist und die Nummer jedes Listenobjekts erhöht wird, also 1, 2, 3, 4, 5

Gewünschtes Ergebnis:

   1
   2
   3
   4
   5

Answer 1

Ich bin auf dasselbe Problem gestoßen. Ich bin auf diesen Thread gestoßen, mochte aber die Methoden, die sie hier hatten, nicht. Meine Lösung bestand darin, underscore.js zu verwenden, das wir bereits installiert hatten. Es ist so einfach wie das:

    {{n}}

Dies wird genau das tun, wonach du suchst.

Answer 2

Ich wollte meinen HTML-Code sehr minimal halten, daher habe ich einen kleinen Filter definiert, der das Array [0,1,2,...] erstellt, wie es andere getan haben:

angular.module('awesomeApp')
  .filter('range', function(){
    return function(n) {
      var res = [];
      for (var i = 0; i < n; i++) {
        res.push(i);
      }
      return res;
    };
  });

Danach ist es im View möglich, es wie folgt zu verwenden:

    {{i+1}}

Answer 3

Dies ist wirklich HÄSSLICH, aber es funktioniert ohne Controller für eine Ganzzahl oder Variable:

Ganzzahl:

{{$index}}

Variable:

{{$index}}

Answer 4

Es gibt viele Möglichkeiten, dies zu tun. Ich war wirklich gestört davon, die Logik in meinem Controller zu haben, also habe ich eine einfache Direktive erstellt, um das Problem des Wiederholens eines Elements n-mal zu lösen.

Installation:

Die Direktive kann mit bower install angular-repeat-n installiert werden.

Beispiel:

{{$index}}

``

ergibt: 1234

Es funktioniert auch mit einer scope-Variablen:

Quelle:

Github

``

Answer 5

Dies ist nur eine leichte Variation der akzeptierten Antwort, aber du musst wirklich keine neue Funktion erstellen. Importiere nur 'Array' in den Scope:

              {{$index+1}}

var app = angular.module('myapp',[]);
app.controller('ctrlParent',function($scope){
    $scope.myNumber = 5;
    $scope.counter = Array;
});

Siehe dieses Beispiel für eine Live-Demo.