如何在ngFor Angular 5中过滤今天的日期顺序?

时间:2018-07-19 12:27:17

标签: angular date filter ngfor

我只想按“我的仪表盘”上的“今天的日期”顺序进行过滤。有什么可能的解决方案?

{
      "added_on": "2018-07-19T12:50:02.369Z",
      "deleted": false,
      "_id": "5b001d7a57579f58422437e6",
      "restaurant_id": "5ab9d70f7c4f1e25a7304779",
      "user_id": null,
      "discount_total": 2,
      "__v": 0
}

这是我的数据。日期位于名为added_on的字段上。所以我想在仪表板上过滤今天的订单数据。

1 个答案:

答案 0 :(得分:0)

您可以尝试使用此解决方案。

我已经在Stackblitz上创建了一个演示

  

order-by.pipe.ts

import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
  name: 'orderBy',
})
export class OrderByPipe implements PipeTransform {

  transform(array: Array<any>, args: string): Array<any> {
    if (typeof args[0] === "undefined") {
      return array;
    }
    let direction = args[0][0];
    let column = args.replace('-', '');
    array.sort((a: any, b: any) => {
      let left = Number(new Date(a[column]));
      let right = Number(new Date(b[column]));
      return (direction === "-") ? right - left : left - right;
    });
    return array;
  }

}
  

app.component.ts

data = [{
    "added_on": "2018-07-12T12:50:02.369Z",
    "deleted": false,
    "_id": "5b001d7a57579f58422437e6",
    "restaurant_id": "5ab9d70f7c4f1e25a7304779",
    "user_id": null,
    "discount_total": 1,
    "__v": 0
  }, {
    "added_on": "2018-07-19T12:50:02.369Z",
    "deleted": false,
    "_id": "5b001d7a57579f58422437e6",
    "restaurant_id": "5ab9d70f7c4f1e25a7304779",
    "user_id": null,
    "discount_total": 2,
    "__v": 0
  }, {
    "added_on": "2018-07-19T12:50:02.369Z",
    "deleted": false,
    "_id": "5b001d7a57579f58422437e6",
    "restaurant_id": "5ab9d70f7c4f1e25a7304779",
    "user_id": null,
    "discount_total": 3,
    "__v": 0
  }]
  

app.component.html

*ngFor="let datas of data | orderBy:'-added_on'"