Sort an Array of Objects angular typescript

Question

In TypeScript application i set array of objects and show it to user in my template

feedList: News[] =
  [
    { type: 1, slug: 'news', date: '2018/04/30', title: 'Header New', content: 'Lorem ipsum dolor sit amet'},
    { type: 2, slug: 'post', date: '2018/04/20', title: 'Header New', content: 'Lorem ipsum dolor sit amet' },
    { type: 1, slug: 'news', date: '2018/04/28', title: 'Header New', content: 'Lorem ipsum dolor sit amet' },
    { type: 1, slug: 'news', date: '2016/04/28', title: 'Header New', content: 'Lorem ipsum dolor sit amet' },
    { type: 2, slug: 'post', date: '2018/03/28', title: 'Header New', content: 'Lorem ipsum dolor sit amet' }
  ];

I have a function of sorting

sortByType(feedList: News[]): void {
    feedList.sort(function(a, b) {
      return a.type - b.type;
    });
  }

And I calling it in template

%button.btn{(click)="sortByType(this.feedList)"} Sort

But there is no changes and to errors. What I doing wrong?

If I use simply

[#objectarray#].sort(function(a, b) {
          return a.type - b.type;
        });

— it works

upd: all template

.feed
  %button.btn{(click)="sortByType(this.feedList)"}
    Sort by type
  .f-item{*ngFor: "let feedItem of feedList", class: "{{feedItem.slug}}"}
    .type
      {{feedItem.type}} {{feedItem.slug}}
    .date
      {{feedItem.date}}

Can you show more of your template? It looks like syntax error to me. — Kelvin Lai
– Kelvin Lai, Commented Apr 29, 2018 at 7:31
Yes, thanx! In haml i must to use tar{key: value, but i used = — user2155564
– user2155564, Commented Apr 29, 2018 at 10:25

Harsha Vardhan Reddy N · Accepted Answer · 2019-11-19 12:48:28Z

3

If the value is string

 data.sort((a, b) => a.status.localeCompare(b.status));

If the value is int

data.sort((a, b) => a.status===b.status?-1:0);

answered Nov 19, 2019 at 12:48

Harsha Vardhan Reddy N

516 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Masoud Bimmer · Accepted Answer · 2019-01-11 18:12:35Z

I write a sort function by Typescript in Angular that sort an array of object based on property of list.

Assume we Have a List of Objects Like That:

Items: News[] =

      [
        { type: 1, slug: 'news', title: 'Header New', content: 'Lorem ipsum dolor sit amet'},
        { type: 2, slug: 'post', title: 'Header New', content: 'Lorem ipsum dolor sit amet' },
        { type: 1, slug: 'news', title: 'Header New', content: 'Lorem ipsum dolor sit amet' },
        { type: 1, slug: 'news', title: 'Header New', content: 'Lorem ipsum dolor sit amet' },
        { type: 2, slug: 'post', title: 'Header New', content: 'Lorem ipsum dolor sit amet' }
      ];

My Function is Like That:

sort(array:any[],property:string,isNumber:boolean){
        if(isNumber){
            return array.sort((item1,item2)=> {
                return (item1[property] > item2[property]) ? 1 : -1;});
        }else{
            return array.sort((item1,item2)=> {
                return (item1[property].toLowerCase() > item2[property].toLowerCase()) ? 1 : -1;});
        }
    }

param 1 : is array that should be sort
param 2 : is the property that sorting happens based on it
param 3 : is the Boolean that determine param 2 is number or string

Lia · Accepted Answer · 2018-04-29 07:32:56Z

0

in your template:

(click)="sortByType(feedList)"

in component:

sortByType(feedList: News[]): void {
    feedList.sort(function(a, b) {
      return a.type - b.type;
    });
this.feedList = feedList  }

in your template where you want to show the sorted array put:

{{feedList|json}}

answered Apr 29, 2018 at 7:32

Lia

12k3 gold badges35 silver badges53 bronze badges

1 Comment

user2155564 Over a year ago

I found syntax error in template. Thanx for you answer

Collectives™ on Stack Overflow

Sort an Array of Objects angular typescript

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related