2016-05-14 6 views
2

Wie zu ng-repeat über Array mit String-Index? Bitte beachten Sie den folgenden Code-Schnipsel:AngularJS - ng-Wiederholung über Array mit String-Index

Der folgende Code befindet sich in einem Controller.

$scope.days = ["mon", "tue", "wed" .... "sun"]; 
$scope.arr = []; 
$scope.arr["mon"] = ["apple","orange"]; 
$scope.arr["tue"] = ["blue","swish"]; 
. 
. 
. 
$scope.arr["sun"] = ["pineapple","myfruit","carrot"]; 

Frage - Wie ng-repeat wie etwas weiter unten, ist es möglich?

<div ng-repeat="day in days">{{day}} 
    <span ng-repeat="item in arr(day)">{{item}}</span> 
    <-- Something like "arr(day)", can it be done in angular --> 
</div> 
+0

Sie wollen, dass es in der Steuerung oder eine Vorlage zu tun? – sumair

+0

@sumair - In Vorlage (die HTML-Datei) –

+0

Aus Interesse, warum verwenden Sie kein Objekt? – SmokeyPHP

Antwort

1

Verwenden Sie eckige Klammern, um auf Objekt/Array-Felder/Elemente zuzugreifen.

<div ng-repeat="day in days">{{day}} 
    <span ng-repeat="item in arr[day]">{{item}}</span> 
</div> 
0

Sie können es verwenden, wie diese ng-repeat="item in arr[day]"

0

Sie auch die Artikelnummer drucken.

<div ng-repeat="day in days"> 
    {{day}} 
    <div ng-repeat="(key, value) in arr[day]">Item #{{key + 1}}: {{value}} 
    </div> 
    <br /> 
</div> 
3

Sie können normale Syntax für Element in einem Array verwenden. Siehe meine Geige

<div ng-app='app' ng-controller='default' ng-init='init()'> 
    <div ng-repeat='day in days'> 
    <strong>{{day}}</strong><br/> 
    <span ng-repeat="item in arr[day]">{{item}} </span> 
    </div> 
</div> 

https://jsfiddle.net/DoTH/evcv4tu5/3/

0

Ja, das ist absolut möglich ist. Sehen Sie ein funktionierendes Beispiel unten:

var app = angular.module("sa", []); 
 

 
app.controller("FooController", function($scope) { 
 
    $scope.days = ["mon", "tue", "wed", "sun"]; 
 
    $scope.arr = []; 
 
    $scope.arr["mon"] = ["apple", "orange"]; 
 
    $scope.arr["tue"] = ["blue", "swish"]; 
 
    $scope.arr["sun"] = ["pineapple", "myfruit", "carrot"]; 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="sa" ng-controller="FooController"> 
 
    <ol> 
 
    <li ng-repeat="day in days"> 
 
     <strong>{{day}}</strong> 
 
     <ol> 
 
     <li ng-repeat="item in arr[day]">{{item}}</li> 
 
     </ol> 
 
    </li> 
 
    </ol> 
 
</div>