Angular

Question

对于我的 Angular 项目，我想在组合框中显示 EmpID 值并按姓氏对它们进行排序。

这是一个 html 片段，我在其中尝试实现管道。

    <select id="empName" [(ngModel)]="selectedEmployee">
      <option selected="selected" disabled>Employee Name...</option>
      <option *ngFor="let emp of empInfo; let i = index" [ngValue]="i">{{emp.EmpID | orderByLast}}</option>
    </select>

这是我的 orderByLast.pipe.ts :

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({ name: 'orderByLast' })

export class OrderByLast implements PipeTransform {
    transform(array: Array<string>): Array<string> {
        array.sort((a: any, b: any) => {
            if (a < b) {
                return -1;
            }
            else if (a > b) {
                return 1;
            }
            else {
                return 0;
            }
        });
        return array;
    }
}

这是我的 emp-info.ts 数组：

export class EmpInfo {
    EmpKey: number;
    EmpID: string;
    Firstname: string;
    LastName: string;
    EmpStat: string;
    StartDate: Date;
    AdjustedStart: Date;
    Anniversary: number;
    PTOYear: number;
    STDLTD: number;
    Uncharged: number;
    ETOEarned: number;
    ETORequests: number;
    ETORemaining: number;
    PTOBase: number;
    PTOCarry: number;
    PTOBorrowed: number;
    PTOBalance: number;
    PTORequests: number;
    PTORemaining: number;
}

Answer 1

您需要实现一个transform函数：

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({ name: 'orderByLast' })

export class OrderByLast implements PipeTransform {
  transform() { // add your object as a parameter to transform()
    //write your code to do the sort
  }
}

请参阅此处的 'Custom Pipes' 部分：https://angular.io/docs/ts/latest/guide/pipes.html（请注意，正如@torazaburo 指出的那样，不建议使用管道进行排序，这也在 link 下进行了解释'Appendix: No FilterPipe or OrderByPipe' 部分。）

Answer 2

看这个例子。几个月前，我在自己的应用程序中实现了这个 orderBy 管道。

Angular - 如何按姓氏管道排序

Angular - How to sort by last name pipe

angular2-pipe