输入类型数字无法用数字管道格式化值答案

【问题标题】：Input type number unable to format value with number pipe输入类型数字无法用数字管道格式化值
【发布时间】：2020-09-24 12:54:08
【问题描述】：

我正在尝试在我的 Angular 应用程序中使用数字管道来格式化 <input type=number /> 中的值。

管道应该用三位小数格式化值，默认值为1，在输入框中它应该显示为1.000，但是如果我在number之后使用任何digitsInfo，则不会显示任何值在input.

我试图在stackblitz 中重现该问题，但其中的行为与我的 Angular 应用程序中的行为一样，如下所示：

正如您在 gif 上看到的，如果我在输入中的 number: 之后添加 '1.3' 值将会消失..

问题不在于plu.qta 值，因为即使我将静态1 设置为值，它仍然不会在输入中显示任何值。

更新： 好的，我刚刚发现了问题，问题是我将registeredLocale 转换为意大利语，如果我将其从app.module 中删除，则所有格式都正确。

我的 app.module 如下所示：

import localeIt from '@angular/common/locales/it';
import { registerLocaleData } from '@angular/common';
registerLocaleData(localeIt);

@NgModule...
...
providers: [{provide: LOCALE_ID, useValue: 'it'}]

因此，通过将语言环境设置为意大利语，我怎样才能使数字管道正常工作？

【问题讨论】：

标签： angular

【解决方案1】：

通过手动将数字管道中的locale 设置为en-US 解决了这个问题

所以我的输入看起来像这样：

    <input
        type="number"
        class="form-control qta"
        [plu]="plu"
        appQuantity
        [min]="plu.um === 'PZ' ? 1 : .001"
        [step]="plu.um === 'PZ' ? 1 : .001"
        [value]="plu.um !== 'PZ' ? ( plu.qta | number: '1.3':'en-US' ) : plu.qta"
      />

【讨论】：