2017-09-20 18 views
1

私はフロントエンドプロジェクトを作成するためにAngularJsを使用しています。 私の目標は、このように、UIB-アコーディオン、UIB-アコーディオン族元素の中dinamically NのDataTableを作成することです:Angular-Datatablesソート日付列がdd MM yyyy形式で動作しない

<uib-accordion class="" close-others="true"> 
 
    <div uib-accordion-group class="panel-default" ng-repeat="service in orderOrganizerCtrl.tableServiceIdFilter"> 
 
     <uib-accordion-heading> 
 
      {{'2101_OrderEntry.Organizer.Service' | translate}}{{service.key}} <br/> 
 
      <span>{{'2101_OrderEntry.Organizer.SelectedAgenda' | translate}}</span> {{ orderOrganizerCtrl.getAgendaName(service.key) }} <br/> 
 
      <span>{{'2101_OrderEntry.Organizer.DateHourSelected' | translate}}</span> {{ orderOrganizerCtrl.getAppointment(service.key) }} 
 
     </uib-accordion-heading> 
 
     <!-- Here, datatable content --> 
 
     <table class="table data-table row-border hover" id="agenda_{{service.key}}" datatable="ng"> 
 
      <thead> 
 
       <th class="sorting_asc">{{'2101_OrderEntry.Organizer.AgendaServices' | translate}}</th> 
 
       <th class="sorting_asc sorting_1">{{'2101_OrderEntry.Organizer.DateAppointment' | translate}}</th> 
 
       <th class="sorting_asc">{{'2101_OrderEntry.Organizer.HourAppointment' | translate}}</th> 
 
      </thead> 
 
      <tbody> 
 
       <tr ng-click="orderOrganizerCtrl.selectRow(item, 'agenda_' + service.key, service.key)" ng-repeat="item in orderOrganizerCtrl.agendaSimplified track by $index" ng-if="item.serviceName === service.key"> 
 
        <td align="center">{{item.agendaName}}</td> 
 
        <td align="center">{{item.dateAppointment| date:'dd MM yyyy'}}</td> 
 
        <td align="center">{{item.hourAppointment}}</td> 
 
       </tr> 
 
      </tbody> 
 
     </table> 
 
    </div> 
 
</uib-accordion>

私の問題は、 "dateAppointment" 列のソートです。各 "item.dateAppointment"要素は、Date要素です。ソートがうまくいかない理由

this.dtColumnDefs = [ 
 
    DTColumnDefBuilder.newColumnDef(1). 
 
    .withOption('type', 'date') 
 
];

しかし、(テーブルがdinamically作成されているからでしょう)動作していない:私はこのようにdtColumnDefsの定義とDTColumnDefBuilderを使用しようとしました。 誰かが私を助けることができますか?

答えて

1

並べ替える順序と並べ替える列を指定する必要があります。試してみてください:

$scope.dtOptions = DTOptionsBuilder.newOptions() 
     .withPaginationType('full_numbers') 
     .withDisplayLength(10) 
     .withOption('order', [0, 'desc']); 

$scope.dtColumnDefs = [ 
     DTColumnDefBuilder.newColumnDef(0).withOption('type', 'date'), 
     DTColumnDefBuilder.newColumnDef(1).notSortable(), 
     DTColumnDefBuilder.newColumnDef(2).notSortable(), 
     DTColumnDefBuilder.newColumnDef(3).notSortable(), 
     ... 
    ]; 

ここで、最初の列は日付列になります。希望します..

+0

それは動作します!ありがとう!! – user3518755

+0

それはあなたを助けてくれてうれしいです..もしこの答えが役に立つなら、アップしてください。 – Raghav

関連する問題