javascript - Sort by date Angular 2 pipe - Stack Overflow

admin管理员组

文章数量:1199958

Here is my code:

<div *ngFor="let conv of lender.conversation | orderBy" class="conv-single">
   {{conv.date | date: 'dd/MM/yyyy | j'}} - {{conv.text}}
</div>

I have object like this:

[{
date: somedate,
text: "text1" 
}
...]

And here is my orderBy pipe:

@Pipe({
    name: 'orderBy'
})
export class OrderByPipe implements PipeTransform {

    transform(value: any, args?: any): any {
        let newVal = value.sort((a: any, b: any) => {
            let date1 = new Date(a.date);
            let date2 = new Date(b.date);

            if (date1 > date2) {
                return 1;
            } else if (date1 < date2) {
                return -1;
            } else {
                return 0;
            }
        });

        return newVal;
    }

}

Problem is I always get elements in same order anyone know what is problem?

Here is my code:

<div *ngFor="let conv of lender.conversation | orderBy" class="conv-single">
   {{conv.date | date: 'dd/MM/yyyy | j'}} - {{conv.text}}
</div>

I have object like this:

[{
date: somedate,
text: "text1" 
}
...]

And here is my orderBy pipe:

@Pipe({
    name: 'orderBy'
})
export class OrderByPipe implements PipeTransform {

    transform(value: any, args?: any): any {
        let newVal = value.sort((a: any, b: any) => {
            let date1 = new Date(a.date);
            let date2 = new Date(b.date);

            if (date1 > date2) {
                return 1;
            } else if (date1 < date2) {
                return -1;
            } else {
                return 0;
            }
        });

        return newVal;
    }

}

Problem is I always get elements in same order anyone know what is problem?

• javascript
• angular

Share Improve this question Follow edited Dec 13, 2016 at 15:57 Mistalis 18.3k1313 gold badges7777 silver badges9797 bronze badges asked Dec 13, 2016 at 15:56 Vladimir DjukicVladimir Djukic 2,07277 gold badges2929 silver badges6262 bronze badges 3

• 1 The pipe appears to correctly order: plnkr.co/edit/HFjmewVizhEVvon8wRjQ?p=preview – silentsod Commented Dec 13, 2016 at 17:06
• So, given that, why do you want the elements to be changing their order? – silentsod Commented Dec 13, 2016 at 18:27
• I hope, You are comparing dates in millisecond format and not in Date format. – Ambuj Khanna Commented Mar 18, 2019 at 5:35

Add a comment  | 

3 Answers 3

Sorted by: Reset to default 21

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()
    );
}

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;
  }
}

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>

本文标签： javascriptSort by date Angular 2 pipeStack Overflow