angular - Angular DecimalPipe 转换在 Firefox 中不起作用

Question

我以编程方式应用 DecimalPipe 转换将数字格式化为具有两位小数。这适用于 Chrome、IE 和 Edge。它不适用于 Firefox (60.0.2)。

<input class="hour-input" min="0" max="24" type="number" step=".01" [(ngModel)]="hours">

export class HourComponent {
    hours: string;
    constructor(private numberPipe: DecimalPipe) { }

    formatHours() {
        this.hours = this.numberPipe.transform(this.hours, '1.2-2');
    }
}

我认为这篇提到intl包的帖子可能是相关的，但我已经在导入这个 polyfill。从Angular v5开始，Angular管道不再依赖于 intl 包，这也是我的理解。我正在使用标准的LOCALE_ID模式。

请注意，如果直接在 UI 中使用，DecimalPipe 确实可以在 Firefox 中使用：

{{hours | number: '1.2-2'}}

标签： angularformattingangular-pipe

Answer 1

看起来这不是 Angular 的问题，而是 Firefox 处理数字输入的问题。默认情况下，Firefox 中的数字输入会清除小数点后的零。这似乎是一个长期存在的问题，目前还没有标准解决方案。

看起来这个创可贴修复可能会起作用。这涉及在用户键入时将输入类型动态更改为数字，然后在模糊时将其更改回文本。有点骇人听闻。

希望看到 Firefox 为此实现标准覆盖或改进默认值。