抓取輸入值並將其插入* ngFor指令？

Question

我還是Angular/JS的新手......我通過過濾管道顯示了一堆數據，現在我希望能夠切換數據的排序方式：升序或降序。我有一個完美的「orderBy」管道，但我現在必須對方向進行硬編碼，並且我希望它是動態的。我想通過兩個單選按鈕實現這一點，但是我無法抓取輸入值並將其插入到我的* ngFor指令中。

<input type="radio" value="+"> Ascending<br> 
<input type="radio" value="-"> Descending<br> 

我需要抓住「+」或「 - 」並在「recordStartDate」之前插入它。

<li (click)="showArtist(item);" 
    *ngFor="let item of artists | search: field1Filter | orderBy: 
    ['recordStartDate']"> 
</li> 

[ '- recordStartDate ']結果降序排列，並[' + recordStartDate']（或無符號在所有的）產生上升。

達到此目的的最佳方法是什麼？

謝謝！

編輯：

我在這裏使用這條管道：https://stackoverflow.com/a/35635370/8201772這裏有它的一個演示：http://fuelinteractive.github.io/fuel-ui/#/pipe/orderby。請注意，在演示中，有些選項可以通過「+」和「 - 」控制數據是按升序還是降序排序。我怎樣才能複製這些選擇功能？我會對原始答案發表評論，但我需要50+聲望才能這樣做。謝謝！

編輯二：

好了，我已經更新了兩個單選按鈕，如下圖所示：

<input type="radio" name="orderbydescending" [(ngModel)]="orderbydescending" value="['+recordStartDate']">Ascending<br> 
<input type="radio" name="orderbydescending" [(ngModel)]="orderbydescending" value="['-recordStartDate']">Descending 

並使用我的觀點如下：

*ngFor="let item of artists | search: field1Filter | orderBy : orderbydescending" 

然後我得到以下錯誤：http://imgur.com/a/KOxv5。

如果我刪除「['」和「']」單選按鈕的值，那麼管道停止正常工作（並且我仍然得到相同的錯誤）。

任何想法？再一次，硬編碼這完美的作品。謝謝！

Answer 1

我真的用一個布爾值來測試哪個方向來過濾

<input type="radio" [(ngModel)]="orderbydescending" name="orderbydescending" value="false">Ascending<br> 
<input type="radio" [(ngModel)]="orderbydescending" name="orderbydescending" value="true">Descending 

在你看來

然後：

<li (click)="showArtist(item);" *ngFor="let item of artists | search: field1Filter | orderBy : orderbydescending"> 
    {{ data goes here }} 
</li> 

那麼你的過濾器會接受orderbydescending值作爲參數：

export class OrderByPipe implements PipeTransform { 

    transform(value: any[], args?: any): any[] { 
     // args holds true if ordering by descending, otherwise, you are ordering ascending 
    } 
}