在 angularjs 中使用 ng-repeat 时如何将当前月份保持在列表顶部

How to keep current month on top of list, when using ng-repeat in angularjs

我有假期列表,我正在使用 ng-repeat 在 html 上显示它。 它工作正常,但我需要在列表顶部列出当前月份的假期(或即将到来的假期)如何做到这一点....帮助我

我的名单是

$scope.holidaylist =
[
 {
  "lineId":0,
  "holidayMasterId":0,
  "holidayName":"NewYear",
  "startDate":"2016-01-01T00:00:00",
  "endDate":"2016-01-01T00:00:00",
  "startDay":"Friday"
  },
  {
  "lineId":0,
  "holidayMasterId":0,
  "holidayName":"Sankranthi",
  "startDate":"2016-01-15T00:00:00",
  "endDate":"2016-01-15T00:00:00",
  "startDay":"Friday"
  },
  {
  "lineId":0,
  "holidayMasterId":0,
  "holidayName":"Ugadi",
  "startDate":"2016-04-04T00:00:00",
  "endDate":"2016-04-04T00:00:00",
  "startDay":"Monday"
  },
  {
  "lineId":0,
  "holidayMasterId":0,
  "holidayName":"Ugadi",
  "startDate":"2016-04-05T00:00:00",
  "endDate":"2016-04-05T00:00:00",
  "startDay":"Tuesday"
  },
  {
  "lineId":0,
  "holidayMasterId":0,
  "holidayName":"Ugadi",
  "startDate":"2016-04-06T00:00:00",
  "endDate":"2016-04-06T00:00:00",
  "startDay":"Wednesday"
  },
  {
  "lineId":0,
  "holidayMasterId":0,
  "holidayName":"Ugadi",
  "startDate":"2016-04-07T00:00:00",
  "endDate":"2016-04-07T00:00:00",
  "startDay":"Thursday"
  },
  {
  "lineId":0,
  "holidayMasterId":0,
  "holidayName":"Ugadi",
  "startDate":"2016-04-08T00:00:00",
  "endDate":"2016-04-08T00:00:00",
  "startDay":"Friday"
  }
];

这是我的标记

                <li ng-if="holidaylist!=null" class="order-item" ng-repeat="holiday in holidaylist">
                    <div class="row">
                        <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8 item-left">
                            <div class="item-booker">{{holiday.holidayName}}</div>
                            <div class="item-time">
                                <i class="fa fa-calendar"></i>
                                <span>{{holiday.startDate | date:'dd-MM-yyyy'}}</span>
                            </div>
                        </div>
                        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4 item-right">
                            <div class="item-price">
                                <span class="price">{{holiday.startDay}}</span>
                            </div>
                        </div>
                    </div>
                </li>

使用orderBy: 'startDate':true对假期进行排序。 反向参数是一个布尔值。

<li ng-if="holidaylist!=null" class="order-item" ng-repeat="holiday in holidaylist | orderBy: 'startDate':true">
                    <div class="row">
                        <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8 item-left">
                            <div class="item-booker">{{holiday.holidayName}}</div>
                            <div class="item-time">
                                <i class="fa fa-calendar"></i>
                                <span>{{holiday.startDate | date:'dd-MM-yyyy'}}</span>
                            </div>
                        </div>
                        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4 item-right">
                            <div class="item-price">
                                <span class="price">{{holiday.startDay}}</span>
                            </div>
                        </div>
                    </div>
                </li>