首页 > 解决方案 > Angular - 在括号中显示负值并保持“类型:数字”

问题描述

我正在使用百分比图表,我想将负数格式化为括号而不是负号。我可以找到如何使用管道来执行此操作......但前提是我有货币管道,然后将数字类型转换为字符串。有没有办法保持类型为数字并用括号代替负号?这是管道:

export class MinusToParensPipe implements PipeTransform {
    transform(value: any, args?: any): any {
        return value.charAt(0) === '-' ?
            '(' + value.substring(1, value.length) + ')' :
            value;
    }
}

标签: angulartypescript

解决方案


如果不需要管道,请尝试以下操作:

HTML

<p [ngClass]="{'setPerens' : isNegitive(YourNumericalValue)}">{{YourNumericalValue | negToPos }}</p>

SASS

.setPerens {
 :before {
  content: '(';
 :after {
  content: ')';
 }
}

.TS

isNegitive(val: number): boolean {
 if (val < 0) {
  return true;
 } else {
  return false
 }
}

编辑1:

为了摆脱减号,您现在可以像这样使用管道:

@Pipe({
  name: 'negToPos'
})
export class NegToPosPipe implements PipeTransform {
  transform(val: number): number {
    return Math.abs(val);
  }
}

推荐阅读