javascript - 从 JSON 中的现有数据创建日期显示

Question

我创建了一个 Controller ，可以提前几天创建

$http.get('js/data.json')
    .success(function(data) {
      $scope.events = data.events;
      $scope.nextDates = [];
          for (i = 0; i <= 2; i++) {
            // Locked the start date for this example
            var d = new Date('2016.04.24 23:14:13'); 
            $scope.nextDates.push(d.setDate(d.getDate() + i));
          }
     });

然后我有一个包含一些计划事件的 JSON 文件

{
  "events": [
              { "name": "Monday Bloody Monday",
                "dates": ["Mon Apr 25 2016 00:00:00 GMT+0200 (CEST)"]
              },
              { "name": "Hard Work",
                "dates": ["Mon Apr 25 2016 00:00:00 GMT+0200 (CEST)",
                          "Tue Apr 26 2016 00:00:00 GMT+0200 (CEST)",
                          "Wed Apr 27 2016 00:00:00 GMT+0200 (CEST)",
                          "Thu Apr 28 2016 00:00:00 GMT+0200 (CEST)",
                          "Fri Apr 29 2016 00:00:00 GMT+0200 (CEST)"
                         ]
              }
             ]  
}

(不确定字符串是否是存储日期的最佳方式。认为也许 unix epo 编号会更好)

我尝试了以下方法，但没有成功

<div ng-repeat="day in nextdates">
  <h2>{{day | amDateFormat:'dddd, Do MMMM YYYY'}}</h2>

  <div ng-repeat="event in events">
    <div ng-repeat="date in event.dates"
         ng-show="{ day.diff(Date(date)) < 0 }">
      <p>{{event.name}}</p>    
    </div>
  </div>
</div>

顺便说一句:我注入(inject)了 Angular 矩(amDateFormat)来帮助人们读取输出

如何比较日期以查看是否是同一天，然后显示出来？

<小时/>

输出应该是这样的

2016 年 4 月 25 日星期一

星期一血腥星期一

努力工作

2016 年 4 月 26 日星期二

努力工作

2016 年 4 月 27 日星期三

努力工作

2016 年 4 月 28 日星期四

努力工作

2016 年 4 月 29 日星期五

努力工作

也许我应该将逻辑保留在 Controller 中......

Answer 1

希望您使用Underscore.js我们在做js开发的时候，很自然的选择api。希望对你有帮助。

JS

$scope.filteredEvents=[];

  _.each(nextdates, function (d) {
   _.each(events, function (e) {
   _.each(e.dates, function (dt) {
        var difference = moment(d) - moment(dt);
        if (difference == 0) {
           $scope.filteredEvents.push(e);
        } 
     });
   });
  });

Html

<div ng-repeat="day in nextdates">
  <h2>{{day | amDateFormat:'dddd, Do MMMM YYYY'}}</h2>

  <div ng-repeat="event in filteredEvents">
     <p>{{event.name}}</p>    
  </div>
</div>