我正在使用ionic 2并尝试在*ngFor=""中对我的数组进行排序。Angular 2管道参数失败

可悲的是它引发了我的错误，我不知道为什么，这里是related post

我对象的数组看起来像这样：

我管看起来是这样的：

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

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

我* ngFor：

<button ion-item *ngFor="let user of users | order-by:'likes'" >

错误或

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

    <ion-list> 
      <button ion-item [ERROR ->]*ngFor="let user of users | order-by: 'likes'">

其他的也一样problem。不知道为什么它不起作用..

做有可能有另一个管道排序数组？：）谢谢！

来源

2017-03-09 luiswill

任何错误在浏览器控制台？ –

可能是管道名称？我有一个名为'orderBy'的类似管道可以工作。另外，我将'args'作为'Array'传入：'['likes']'。 – Arg0n

@GünterZöchbauer错误的控制台是在我的问题下的错误标题（更新） @ Arg0n没有管道名称在装饰器'@Pipe（{name：'order-by'}）'所以我认为是正确的。你的管道是按孩子值排序的吗？ :) – luiswill

问题解决了！

所以首先用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; 
    }); 
    } 
}

因为在角2 异步，我不得不把if(arr === undefined){return null;}否则它抛出一个错误：在我模板

Cannot read property 'sort' of undefined

最后.html我改为：

<button ion-item *ngFor="let user of (users | orderBy)">

（我没有把(users | orderBy) | async因为我的数组不再是一个FireBaseListObservable，但只有一个数组，所以没有必要在我看来）

来源

2017-03-09 15:33:08 luiswill

似乎你不再使用lodash，所以你可以删除导入。正如我前面所说，如果您有兴趣，我还有另一个OrderByPipe，它不受限于硬编码比较值。 – Arg0n

好的，谢谢，atm我只需要一个比较号码的管道，非常感谢你:)！ – luiswill

Angular 2管道参数失败

错误或

回答

问题解决了！

相关问题