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');
    }
}

我认为提到post软件包的intl可能与之相关，但是我已经在导入此polyfill。据我了解，Angular pipes no longer depend on the intl package自Angular v5起。我正在使用标准的LOCALE_ID模式。

请注意，如果直接在用户界面中使用DecimalPipe，则可以在Firefox中使用：

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

Answer 1

看来，这不是Angular的问题，而是Firefox处理数字输入的问题。 Firefox中输入的数字默认清除小数点后的零。这似乎是longstanding issue，尚无标准解决方案。

看起来像这样的band-aid fix可能有用。这涉及在用户键入时将输入类型动态更改为数字，然后在模糊时将其更改回文本。有点hacky。

希望看到Firefox为此实现标准的替代或改进的默认设置。