Angular 2：ngFor在下降順序

Question

我有一個組件與項目的數組。

每當用戶點擊一個按鈕，一個新的項目添加到這個數組。

該陣列在一個ngFor循環示出這種方式：

<li *ngFor="let log of Logs" class="list-group-item" [innerHTML]="log"</li> 

現在，新日誌的在列表的底部所示。我正在嘗試將新日誌顯示在列表頂部。

如何使用角度2來完成？

Answer 1

您可以爲此創建一個自定義管道：

@Pipe({ 
    name: 'reverse' 
}) 
export class ReversePipe { 
    transform(arr) { 
    var copy = arr.slice(); 
    return copy.reverse(); 
    } 
} 

（請注意，我創建了數組的一個副本不更新源陣列）

，並使用這種方式：

<li *ngFor="let log of Logs | reverse" 
    class="list-group-item" [innerHTML]="log"</li> 

不要忘記將此管道添加到您使用它的組件的pipes屬性中。