角度 2 自定义排序管帮助我普拉斯

Question

 *ngFor="let match of virtual | groupby : 'gameid'

ı 有类似的代码。 和 ı 有一个管道. GameID就像23342341。

ı 需要按 gameid 对这个数组进行 ASC 排序。 帮帮我伙计们. 需要什么样的代码。

import { Pipe, PipeTransform, Component, NgModule} from '@angular/core';
/**
 * Generated class for the GroupbyPipe pipe.
 *
 * See https://angular.io/api/core/Pipe for more info on Angular Pipes.
 */
@Pipe({
  name: 'groupby',
})
export class GroupbyPipe implements PipeTransform {
  /**
   * Takes a value and makes it lowercase.
   */
   transform(array: Array<string>, args: string): Array<string> {
        if (array !== undefined) {
            array.sort((a: any, b: any) => {
                if ( a[args] < b[args] ){
                    return -1;
                } else if ( a[args] > b[args] ) {
                    return 1;
                } else {
                    return 0;   
                }
            });
        }
        return array;
    }
}

和它的我的管道 ts

ı

在谷歌中找到了代码，但它不起作用。 任何人都会帮助我 ı 如何通过 gameID(整数(在管道上对我的数组进行排序？

Answer 1

我添加了 changeDetectorRef 来检测本地的变化。 有时订阅中的数据更改不会反映。下面是我带有changeDetectorRef和slice的示例代码。同时使用两者并查看。这是我的工作版本

import { Component, ChangeDetectorRef } from '@angular/core';
@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
 term:string = "";
  topics = [
    {type:"NonFiction", name:"Titanic", num:2},
    {type:"Fiction", name:"Avatar", num:1},
    {type:"Tragedy", name:"MotherIndia",num:5},
  ];
  constructor(public ref : ChangeDetectorRef) { }
  ngOnInit() {
    this.addTopic();
  }
  addTopic(){
    setTimeout(()=>{
      console.log("triggered");
      this.topics.push({type:"share", name:"MotherIndia",num:3});
      this.topics=this.topics.slice();
      this.ref.detectChanges();
    },5000)
  }
}