javascript - 在我的案例中,如何使用 AngularJs 显示数组?

标签 javascript angularjs

我有一个如下所示的 javascript 数组:

var array = [
   2005 = [
       Jan = [0,1,2,3,5...],
       Feb = [0,1,2,3,5...],
       ...more
   ], 
   2006 = [
       Jan = [0,1,2,3,5...],
       Feb = [0,1,2,3,5...],
       ...more
   ], 
   2007 = [
       Jan = [0,1,2,3,5...],
       Feb = [0,1,2,3,5...],
       ...more
   ]

]

$scope.cal = array;

我正在尝试使用 ng-repeat 构建一个日历

<div ng-repeat = "year in cal">
    {{year}}
</div>

没有任何输出,我得到一个错误

Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. 
Repeater: year in cal, Duplicate key: undefined:undefined, Duplicate value: undefined

我不确定我做错了什么,我的大脑被炸了。请帮我解决这个问题。谢谢!

最佳答案

您需要一个可以绑定(bind)到的不同年份条目之间的公共(public)属性。因此,您需要某种类型的值属性来保存诸如年或月之类的标识符,以及另一个保存值数组的属性。请参见下面的示例。

var myApp = angular.module('myApp', []);

myApp.controller('MyCtrl', function ($scope) {
    $scope.cal = [
        {
            value: 2005,
            month:
            [
                {
                    value: 'Jan',
                    days: [0, 1, 2, 3]
                },
                {
                    value: 'Feb',
                    days: [0, 1, 2, 3]
                }
            ]
        },
        {
            value: 2006,
            month:
            [
                {
                    value: 'Jan',
                    days: [0, 1, 3, 7]
                },
                {
                    value: 'Feb',
                    days: [0, 1, 2, 3]
                }
            ]
        }
    ];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
    <div ng-controller="MyCtrl">
      <div ng-repeat = "year in cal">
          Year: {{year.value}}
          <div ng-repeat = "month in year.month">
              Month: {{month.value}}
              <div ng-repeat = "day in month.days">
                Day: {{day}}
              </div>
          </div>
      </div>
    </div>
</div>

关于javascript - 在我的案例中,如何使用 AngularJs 显示数组?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26646120/

相关文章:

javascript - Angular Bootstrap UI 模式未显示

angularjs - 无法在 Angular Bootstrap 模式窗口中获取对剑道网格的引用

ios - 初始化推送通知时 ionic 的奇怪内存泄漏导致卡住

jQuery .serialize() 在 Angular 中无法正常工作

javascript - AddThis 和 Google Page Speed

javascript - 单击事件未产生预期结果

javascript - 如何获取/设置扩展程序中图像的全局 Google Chrome 内容设置?

javascript - MongoDB 在对象数组中搜索字符串

javascript - Web 音频/ radio 流客户端 : use Howler. js、 native 音频、其他库?

javascript - Angular Material 从 $mdDialog 获取数据并按索引将其传递到表中