ionic g pipe orderBy

会生成文件src/pipes/ordre-by.ts

import { Injectable, Pipe } from '@angular/core';@Pipe({name: 'orderBy'
})
@Injectable()
export class OrderBy {/*Takes a value and makes it lowercase.*/
static _orderByComparator(a:any, b:any):number{if((isNaN(parseFloat(a)) || !isFinite(a)) || (isNaN(parseFloat(b)) || !isFinite(b))){//Isn't a number so lowercase the string to properly compareif(a.toLowerCase() < b.toLowerCase()) return -1;if(a.toLowerCase() > b.toLowerCase()) return 1;}else{//Parse strings as numbers to compare properlyif(parseFloat(a) < parseFloat(b)) return -1;if(parseFloat(a) > parseFloat(b)) return 1;}return 0; //equal each other}transform(input:any, [config = '+']): any{if(!Array.isArray(input)) return input;if(!Array.isArray(config) || (Array.isArray(config) && config.length == 1)){var propertyToCheck:string = !Array.isArray(config) ? config : config[0];var desc = propertyToCheck.substr(0, 1) == '-';//Basic arrayif(!propertyToCheck || propertyToCheck == '-' || propertyToCheck == '+'){return !desc ? input.sort() : input.sort().reverse();}else {var property:string = propertyToCheck.substr(0, 1) == '+' || propertyToCheck.substr(0, 1) == '-'? propertyToCheck.substr(1): propertyToCheck;return input.sort(function(a:any,b:any){return !desc ?  OrderBy._orderByComparator(a[property], b[property]): -OrderBy._orderByComparator(a[property], b[property]);});}}else {//Loop over property of the array in order and sortreturn input.sort(function(a:any,b:any){for(var i:number = 0; i < config.length; i++){var desc = config[i].substr(0, 1) == '-';var property = config[i].substr(0, 1) == '+' || config[i].substr(0, 1) == '-'? config[i].substr(1): config[i];var comparison = !desc ?OrderBy._orderByComparator(a[property], b[property]): -OrderBy._orderByComparator(a[property], b[property]);//Don't return 0 yet in case of needing to sort by next propertyif(comparison != 0) return comparison;}return 0; //equal each other});}}
}

要排序的话，直接copy上面代码就好了

在app.module.ts 文件中引入刚才自定义pipe

import { OrderBy } from '../pipes/order-by';

跟声明一个页面是一样，放在declarations:[]里面，即declarations:[OrderBy]

<ion-item-group *ngFor="let group of formatContacts | orderBy:['key']"></ion-item-group>

即就是使用group.key作为排序依据

到此，ionic2 自定义orderBy大功告成