Angular 2 Pipe参数失败

lui*_*ill 2 javascript sorting pipe ionic2 angular

我正在使用离子2并试图在一个数组中排序我的数组*ngFor="".

可悲的是它抛出了一个错误,我不知道为什么,这是相关的帖子

我的对象数组如下所示: 这个

我的烟斗看起来像这样:

import {Injectable, Pipe} from '@angular/core';
import * as _ from 'lodash';

@Pipe({ name: 'order-by' })
export class OrderByPipe {
  transform(array, args) {
    return _.sortBy(array, args);
  }
}
Run Code Online (Sandbox Code Playgroud)

我的*ngFor:

<button ion-item *ngFor="let user of users | order-by:'likes'" >
Run Code Online (Sandbox Code Playgroud)

错误

TypeError: Cannot read property 'toUpperCase' of undefined ("

    <ion-list>
            <button ion-item [ERROR ->]*ngFor="let user of users | order-by: 'likes'">
Run Code Online (Sandbox Code Playgroud)

其他人也有同样的问题.不知道为什么它不起作用..

你有可能有另一个管道来排序数组吗?:) 谢谢 !

lui*_*ill 5

问题解决了 !

所以首先arg0n解决了管道名称的第一个问题,它应该没有-.非常感谢你 !

name: sort-by成为name: sortBy.

其次,我搜索了一个javascript函数,它将对我的数组进行排序.

我的管道是:

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

@Pipe({ name: 'orderBy' })
export class OrderByPipe implements PipeTransform{
   transform(arr){
    if(arr === undefined){return null;}
    return arr.sort((a, b) => {
      if (a.likes < b.likes) {
        return 1;
      }
      if (a.likes > b.likes) {
        return -1;
      }
      return 0;
    });
  }
}
Run Code Online (Sandbox Code Playgroud)

由于角度2中的异步,我不得不把if(arr === undefined){return null;}它抛出一个错误:

Cannot read property 'sort' of undefined
Run Code Online (Sandbox Code Playgroud)

最后在我的template.html中,我改为:

<button ion-item *ngFor="let user of (users | orderBy)">
Run Code Online (Sandbox Code Playgroud)

(我没有放,(users | orderBy) | async因为我的数组不再是FireBaseListObservable,而只是一个数组,所以在我看来没必要)