没有值的Angular货币管道

Question

是否可以使用没有实际金额/价值的货币管道?

使用值如https://angular.io/api/common/CurrencyPipe:

@Component({
selector: 'currency-pipe',
template: `<div>
<!--output 'CA$0.26'-->
<p>{{a | currency:'CAD'}}</p>
</div>`
})
export class CurrencyPipeComponent {
a: number = 0.259;
b: number = 1.3495;
}

输出:CA$0.26

但是，我需要输入'CAD'并输出'CA$'。这可能吗?

所需行为:

@Component({
selector: 'currency-pipe',
template: `<div>
<p>{{currency | currency:'CAD'}}</p>
</div>`
})

期望输出:CA$

Answer 1

查看源代码:

https://github.com/angular/angular/blob/master/packages/common/src/pipes/number_pipe.ts L205

你会发现，如果输入是"非值"，管道返回null;如果下面的函数返回false:

function isValue(value: number|string|null|undefined): value is number|string {
return !(value == null || value === '' || value !== value);
}

可能，实现预期结果的最佳方法是创建自己的管道。看一下currencyipe的代码。最重要的片段是:

currency = getCurrencySymbol(currency, display === 'symbol' ? 'wide' : 'narrow', locale);

可能这就是你想用的。

Answer 2

只是一个稍微不同的想法:不要仅仅为那个有限的用例创建自定义管道。只要去掉货币后面的所有内容。

{{ (0 | currency:'CAD').split('0')[0] }}