如果值是字符串而不是 int 或 float，如何告诉 angular (2) 货币管道按原样显示

Question

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

如果传递的值是 string 或不是 int 或 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> 应显示 .99 -- 包含 $ 符号。

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

我认为它在 angularjs 中是默认发生的，但在 angular2 中它不是默认发生的。

Answer 1

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

首先在您的组件中有一个函数 returns true 当值是一个数字时。

分量

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

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

模板

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

live demo

Answer 2

The manual 明确声明它只接受数字表达式，不接受其他任何内容：

number_expression | currency[:currencyCode[:symbolDisplay[:digitInfo]]]

管道是 really simple 并且可以扩展和使用而不是 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, ...],

如果值是字符串而不是 int 或 float，如何告诉 angular (2) 货币管道按原样显示

How to tell angular (2) currency pipe to display as it is if value is a string not int or float

angular2-pipe

angular

例子