javascript - 是否可以使用 AngularJS $formatters 添加额外的零？ (或者以任何可能的方式，输入数字？)

Question

我想编写 AngularJS 指令，将零添加到输入中的数字中，即使它们不是必需的。我有:

<input type="number" step="0.1">

即使它的值为 1，我也想将其显示为 1.0。当然，如果步长为 0.01，则应始终显示为 1.00。问题的关键在于，如果可能的话，我想使用 number 输入而不是 text (内置 HTML 验证、移动设备键盘等)。所以我考虑了 AngularJS 格式化程序(简单的例子，只是对硬编码值进行格式化):

ngModel.$formatters.push(function(value) {
    return Number((value + 0.00001).toFixed(3));
});

它不起作用，它丢失了不必要的零。而且，因为 input 的类型为 number，所以我无法从格式化程序返回 String。我的尝试很成​​功:Plunker: Directive which adds additional zeros 。 我认为以某种方式应该是可能的(也许没有 Angular？)，因为如果我有硬编码:

<input type="number" value="3.000">

它在输入中显示3.000。即使我在 Plunk 上打开开发者控制台，我也能够执行以下操作:

document.querySelector('#with-directive').value = '33.0'

并且它显示33.0(DOM操作当然是解决这个问题的一个解决方案，但我认为它会导致代码不易于维护，我想尽可能避免它) 我说得对吗，可以吗？如果有人决定帮助我，我将非常感激，提前谢谢。

Answer 1

我建议使用tel类型而不是number。因为 ios 不支持 number 类型，而另一方面，如果您使用 tel 类型，那么您的输出是一个字符串。 你必须像这样调整你的 $formatter 。

ngModel.$formatters.push(function(value) {
    return (parseInt(value)).toFixed(3);
 });