角度2管道更改按鈕單擊表格行

是否可以更改/放置管道來格式化按鈕單擊Angular 2中的特定列？例如，我有一個帶有'姓名'和'小時'列的表格，當我點擊一個按鈕時，顯示'小時'的數據應該轉換爲天，反之亦然。角度2管道更改按鈕單擊表格行

<button class="btn btn-secondary" (click)="convertToDays()">Days</button> 
<button class="btn btn-secondary" (click)="convertToHours()">Hours</button> 

<tbody> 
<td>{{availableLeave.hours}}</td> 
</tbody> 

convertToDays(){ 
//put pipe to format availableLeave.hours to display as days ex.('48' hours should be displayed as '2' days) 
} 

convertToHours(){ 
//will just revert the original formatting of availableLeave.hours which is in hour format 
}

來源

2017-02-13 xird

請張貼演示了代碼你試圖完成。是的，這是可能的，但很難判斷哪200種方式適合您的需求。 –

嗨Gunter，感謝您檢查，我添加了一些我想實現的僞造，但似乎有人發佈了可以幫助的答案，我會檢查哪種方式最適合。 – xird

您可以將參數傳遞到管道像

{{someValue | myPipe:param}} 

<button class="btn btn-secondary" (click)="param = 'd'">Days</button> 
<button class="btn btn-secondary" (click)="param = 'h'">Hours</button>

class MyPipe implements PipeTransform { 
    transform(value, param) { 
    if(param === 'h') { 
     return "..."; 
    } else { 
     return "..."; 
    } 
    } 
}

來源

2017-02-13 10:14:58

根據您的要求，您可以直接在組件文件中使用管道。您可以爲「小時」和「天」中的一個設置兩個管道，然後調用所需管道的變換功能。

有關如何在組件或服務中使用的管道的詳細信息，check this post.

來源

2017-02-13 07:01:59 HirenParekh

角度2管道更改按鈕單擊表格行

回答

相關問題