如何用角度2中的逗号分隔数千

Question

在角度2或4中我希望数字用逗号分隔,当它在输入和用户输入时以及它只是打印时.您有任何想法或解决方案可以分享吗？提前谢谢你们.

Answer 1

这里有2个选项:

管道(用于没有用户交互的文本)

• 对于文本(只是显示某些内容),您可以简单地使用Angular的内置十进制管道

@Component({
  selector: 'number-pipe',
    template: `<div>
    <!--output '25,000.00'-->
    <p>{{mynumber | number:'5.2-2'}}</p>

    <!--output '25 000,00'-->
    <p>{{mynumber | number:'5.2-2':'fr'}}</p>
    </div>`
})
export class NumberPipeComponent {
  mynumber: number = 2500000;
}

该'5.2.2'部分响应定义如下的规则:

{minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}

请注意,locale在格式化时使用逗号或点时,不同的结果会产生不同的结果.

掩码(用于将数字格式化为用户类型的输入)

• 如果你想在用户输入内部格式化数字,<input>你需要使用一个掩码库或像这个npm包或类似的格式化解决方案.

安装软件包后npm install ng2-currency-mask --save,您必须通过它将其添加到您的模块中imports

import { CurrencyMaskModule } from "ng2-currency-mask";

@NgModule({
    imports: [
        ...
        CurrencyMaskModule
    ],
    declarations: [...],
    providers: [...]
})
export class AppModule {}

最后实现它像:

<input currencyMask [(ngModel)]="value" [options]="{ prefix: 'R$ ', thousands: '.', decimal: ',' }"/>

确保检查包提供的所有不同选项.

Answer 2

只需添加此管道{{ mynumber | number:0 }}。它将指定您的值为数字。因此，它将用逗号分隔，然后"0"指定没有小数。