Sort by date Angular 2 pipe

后端 未结 3 1321
梦如初夏
梦如初夏 2020-12-21 15:33

Here is my code:

{{conv.date | date: \'dd/MM/yyyy | j\'}} - {{conv
相关标签:
3条回答
  • 2020-12-21 16:20

    It is strongly suggested not to use such pipes according to Angular Documentation. See https://angular.io/guide/pipes#appendix-no-filterpipe-or-orderbypipe

    You can try something like this:

    ngOnInit() {
        this.sortedItems = items.sort((a: any, b: any) =>
            new Date(a.date).getTime() - new Date(b.date).getTime()
        );
    }
    
    0 讨论(0)
  • 2020-12-21 16:22
    import { Pipe, PipeTransform } from '@angular/core';
    
    @Pipe({
      name: 'sortByDate'
    })
    export class SortByDatePipe implements PipeTransform {
      transform(value: any, args?: any): any {
        const sortedValues = value.sort((a, b) => new Date(b.createdOn).getTime() - new Date(a.createdOn).getTime());
        return sortedValues;
      }
    }
    
    0 讨论(0)
  • 2020-12-21 16:38

    sort-list.pipe.ts

    import { Pipe, PipeTransform } from '@angular/core';
    @Pipe({
      name: 'sortList'
    })
    export class SortListPipe implements PipeTransform {
      transform(value: any, args?: any): any {
            if (typeof args[0] === "undefined") {
                    return value;
            }
            let direction = args[0][0];
            let column = args.replace('-','');
            value.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 value;
        }
    }
    

    product-list.component.html

    /*
    Ascending Order: create_date
    Descending Order: -create_date
    */
    <ul>
        <li *ngFor="let item of productList | sortList : '-create_date'>
    </ul>
    
    0 讨论(0)
提交回复
热议问题