AngularJS

Question

我想用一个简单的 link 来过滤我的观点。我有几个对象都包含一个日期。例如。如果我单击“三月”，则应仅显示 "Startdate" 三月的数据。我在网上搜索但没有找到对我有用的东西。这是我的 json 对象，标准应该是 "Startdate".

trips.son

[{
  "Startdate": "Thu Jan 02 2014 00:00:00 +0100",
  "DAYS": [{
    "DATE": "Thu Jan 02 2014 00:00:00 +0100",
    "IATA": "TXL",
    "DUTY": "6:10"
  }]
}, {
  "Startdate": "Sun Jan 05 2014 00:00:00 +0100",
  "DAYS": [{
    "DATE": "Sun Jan 05 2014 00:00:00 +0100",
    "IATA": "CBTH",
    "DUTY": "8:07"
  }]
}, {
  "Startdate": "Wed Sep 24 2014 00:00:00 +0200",
  "DAYS": [{
    "DATE": "Wed Sep 24 2014 00:00:00 +0200",
    "IATA": "BCN",
    "DUTY": "9:35"
  }, {
    "DATE": "Thu Sep 25 2014 00:00:00 +0200",
    "IATA": "BCN",
    "DUTY": "15:34"
  }]
}, {
  "Startdate": "Sat Sep 27 2014 00:00:00 +0200",
  "DAYS": [{
    "DATE": "Sat Sep 27 2014 00:00:00 +0200",
    "IATA": "CPH",
    "DUTY": "4:44"
  }]
}]

这里你可以明白我的意思了：

更新： plnkr

默认情况下只应显示一月 - 单击每个 link 时更改视图！

Answer 1

我找到了适合我的方法！也许不是最好的，但它会完成工作。

将 StartdateMonth 作为月份名称添加到我的范围：

var date = new Date($scope.trips[i].Startdate);
            $scope.trips[i].Startdate = date;
            var names = ["Januar", "Februar", "März", "April", "Mai", "Juni", "Juli", "August", "September", "Oktober", "November", "Dezember"];
            $scope.trips[i].StartdateMonth = names[date.getMonth()];

为选项卡创建 ng-click：

<li role="presentation"><a ng-click="myFilter = {StartdateMonth: 'Januar'}">Januar</a></li>
<li role="presentation"><a ng-click="myFilter = {StartdateMonth: 'Februar'}">Februar</a></li>

最后添加过滤器：

<div ng-repeat="trip in trips | filter: myFilter">

AngularJS - 使用 ng-click 按月过滤视图

AngularJS - Filter view by month with ng-click

date

filter

angularjs-ng-click