我正在使用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管道參數失敗

錯誤或

回答

問題解決了！

相關問題