5

货币管道应该足够智能以自动处理string, float,int等。

如果传递的值是string或不是intor float,它应该什么都不做并按原样显示传递的值。并且仅在为int或时显示格式化值float

它发生在 angularJs 中,但没有发生在 angular (2) 中

如果它是一个值,如何告诉货币管道逃逸string并进行货币格式化。decimal我期待像下面这样的东西。

例子

<div>Money:{{'xxx/vv/cc' | currency:'USD':true:'1.2-2'}}</div>应该显示 xxx/vv/cc

<div>Money: {{''11.99'' | currency:'USD':true:'1.2-2'}}</div> 应显示$11.99包括 --$ 符号。

但它没有发生。我得到的错误是caused by: Invalid argument 'Included' for pipe 'CurrencyPipe'

我认为它在 angularjs 中默认发生,但在 angular2 中默认情况下不会发生。

4

2 回答 2

10

您可以使用三元运算符a ? b : c来显示b何时a为真,c否则显示。

首先在组件中有一个函数,true当值为数字时返回。

零件

isNumber(e) {return typeof e === 'number'}

然后使用它来确定是将值发送到货币管道还是直接打印

模板

<div>
    {{ isNumber(money) ? (money|currency:'USD':true:'1.2-2') : money }}  
</div>

现场演示

于 2016-10-20T23:03:00.067 回答
6

该手册明确声明它接受一个数字表达式,没有别的:

数字表达式 | 货币[:currencyCode[:symbolDisplay[:digitInfo]]]

管道非常简单,可以扩展和使用,而不是CurrencyPipe符合预期的行为:

const _NUMBER_FORMAT_REGEXP = /^(\d+)?\.((\d+)(-(\d+))?)?$/;

@Pipe({name: 'currency'})
export class LooseCurrencyPipe extends CurrencyPipe {
  transform(value: any, currencyCode: string, symbolDisplay: boolean, digits: string): string {
    if (typeof value === 'number' || _NUMBER_FORMAT_REGEXP.test(value)) {
      return super.transform(value, currencyCode, symbolDisplay, digits);
    } else {
      return value;
    }
  }
}

要创建具有不同名称的新管道,CurrencyPipe可以将其注入自定义管道:

@Pipe({name: 'looseCurrency'})
export class LooseCurrencyPipe implements PipeTransform {
  constructor(private _currencyPipe: CurrencyPipe) {}

  transform(value: any, currencyCode: string, symbolDisplay: boolean, digits: string): string {
    if (typeof value === 'number' || _NUMBER_FORMAT_REGEXP.test(value)) {
      return this._currencyPipe.transform(value, currencyCode, symbolDisplay, digits);
    } else {
      return value;
    }
  }
}

为了CurrencyPipe通过 DI 注入,它应该额外添加到模块提供程序中:

declarations: [LooseCurrencyPipe, ...],
providers: [CurrencyPipe, ...],
于 2016-10-20T23:22:30.010 回答