在Angular Js中比较日期数组与当前日期

时间:2016-05-06 20:09:32

标签: angularjs

我在角度控制器中有一系列日期,我试图将这些日期与今天的当前日期进行比较,如果它们在过去,那么它们应该被赋予“红色”类。但是,我的代码目前已被破坏。不确定我做错了什么,任何帮助或指向正确的方向将不胜感激。

请参阅下面的plunker链接: plnkr

//app.js

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

app.controller('MainCtrl', function($scope) {
  var artists=[
    {eventDate:"2017-01-09"},
    {eventDate:"2016-01-09"},
    {eventDate:"2015-01-09"},
    {eventDate:"2014-01-09"},
    {eventDate:"2013-01-09"},
    ];

  var currentdate = new Date();

  var myEl = angular.element( document.querySelector( '#thing' ) );
  for (i = 0; i < artists.length; i++) {
    if (currentdate > artists[i][0]) {
      myEl.addClass('red');
    }
  }

  $scope.currentdate = currentdate;
  $scope.myEl = myEl;
  $scope.artists = artists;

});

//css
.blue{
  background: blue;
}
.red {
  color: red;
}

//index.html
<html ng-app="plunker">
  <body ng-controller="MainCtrl">
    <div ng-repeat="artist in artists">
     <p id="thing" class="blue">event Date {{artist.eventDate | date}}</p>
   </div>
  </body>
</html>

2 个答案:

答案 0 :(得分:0)

帮自己一个忙,并使用moment比较js中的日期:https://github.com/urish/angular-moment

答案 1 :(得分:0)

你可以用ng-class指令编辑你的html:

<body ng-controller="MainCtrl">
    <div ng-repeat="artist in artists">
      <p id="thing" ng-class="{'red': currentDate > artist.eventDate, 'blue': currentDate <= artist.eventDate}">
        event Date {{artist.eventDate | date}}</p>
    </div>

  </body>