Question

在TypeScript应用程序中，我设置对象数组并在我的模板中将其显示给用户

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

我有排序功能

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

我在模板中调用它

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

但没有变化和错误。我做错了什么？

如果我只使用

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

- 它有效

upd：所有模板

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

Answer 1

在你的模板中：

(click)="sortByType(feedList)"

组件中的

：

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

在模板中要显示已排序的数组：

{{feedList|json}}

Answer 2

我用Angular中的Typescript编写了一个排序函数，该函数根据列表的属性对对象数组进行排序。

假设我们有一个这样的对象列表：

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

我的功能就是这样：

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

参数1：是应该排序的数组
param 2：是基于它进行排序的属性
param 3：是确定param 2是数字还是字符串的布尔值

Answer 3

如果值为字符串

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

如果值为int

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

对对象数组角度打字稿进行排序

3 个答案: