简体   繁体   English

AngularJS - 用字符串索引重复数组

[英]AngularJS - ng-repeat over array with string index

How to ng-repeat over array with string index?如何使用字符串索引ng-repeat数组? Please see below snippet of the code-请参阅下面的代码片段-

Below code is in a 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"];

Question - How to ng-repeat like something below, is it possible?问题 - 如何ng-repeat像下面这样,有可能吗?

<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>

You can just use normal syntax for item in an array.您可以对数组中的项目使用普通语法。 Please refer my fiddle请参考我的小提琴

<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/ https://jsfiddle.net/DoTH/evcv4tu5/3/

Use square brackets to access object/array fields/elements.使用方括号访问对象/数组字段/元素。

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

你可以像这样使用它ng-repeat="item in arr[day]"

You can print the item number too.您也可以打印项目编号。

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

Yes, this is absolutely possible.是的,这是绝对可能的。 See a working example below:请参阅下面的工作示例:

 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>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM