在 Angular 中以德语格式输入十进制数“有逗号”效果不佳
Posted
技术标签:
【中文标题】在 Angular 中以德语格式输入十进制数“有逗号”效果不佳【英文标题】：in Angular Entering Decimal Number in german format "having comma" is not work well 【发布时间】：2015-09-01 20:11:21 【问题描述】：我正在尝试根据用户 PC 本地化数据输入模块（以角度编写）（例如，如果 PC 语言设置为 German ），因此模块应该接受“，”作为小数分隔符而不是“。 " ,
所以我使用了 Angular 本地化文件（例如：angular-locale_de-de.js）但是在使用逗号插入十进制数时出现问题，如下所示：
在德国 PC 设置中，当用户在输入文本框中以这种格式“5,4”插入十进制数时，该值的标签处显示为空而不是 5,40
代码中的标签如下：<label>mynumber | number:2</label>
但是当用户插入：“5.4”时，标签显示“5,40” 为简单起见，我使用下面的代码
<html>
<head>
<script LANGUAGE=javascript src="angular.js"></script>
<script LANGUAGE=javascript src="https://code.angularjs.org/1.2.9/i18n/angular-locale_de-de.js"></script>
</script>
</head>
<body ng-app >
<input type=number id="txt" ng-model="mynumber" >
<label>mynumber| number : 2</label>
</body>
</html>
这也适用于在控制器上使用下面的过滤器：
$filter('number')(mynumber, 2)
在使用逗号分隔符插入数字时，您能否帮助如何正确格式化数字（如上应该是 5,40 而不是空）？
请注意：即使使用“angular-locale_de-de.js”也存在此问题
您能否建议我如何加载正确的角度本地化文件（例如：angular-locale_de-de.js，具体取决于 用户语言 PC 设置）？ 谢谢
【问题讨论】：
很抱歉，我无法理解您的要求。这部分是由于您使用英语（即您能否编辑您的问题并改进语言？我也是非母语人士，所以我知道这很难），但也由于缺少错误消息。你有任何错误吗？或者您获得的输出是什么？它与您期望或想要实现的结果有何不同？ 在法语 Chrome 浏览器中运行良好，该浏览器还接受在数字类型的输入字段中输入的数字中的逗号：plnkr.co/edit/x4K1n2Rp8pE4ctm3y7cB?p=preview。角度在这里无关紧要，AFAIK。重要的是浏览器。数字过滤器所做的只是将浏览器输入字段提供的数字作为参数，并对其进行格式化。 嗨@JBNizet，我使用的是IE，但是它是相同的行为，请尝试更改type="text"，然后再次重新执行Plnkr，然后尝试编写“5.3” chrome然后将显示“5,30”，但是当您使用“，”而不是“。”编写“5,3”时然后 chrome 也会向您显示与 IE 相同的空行为 有什么意义？这显然行不通，因为数字过滤器需要一个数字，而不是字符串。 嗨 JBNized ，德国用户使用“，”来表示十进制数而不是点（基于他们的语言设置），但在这种情况下用户应该写“。”而不是逗号来显示正确的值，我认为在逻辑上Angular应该考虑由“，”分隔的数字作为基于PC用户设置的数字。所以让用户使用“，”作为他们的输入和角度考虑的最佳方式是什么它是一个数字 【参考方案1】：有一个角度指令（我是作者），它只允许数字、减号和选定的分隔符“，”或“，”。链接：https://github.com/uhlryk/angular-dynamic-number
您可以配置整数位数、小数位数、选择分隔符，或允许正数、负数或两者兼有。它阻止输入视图值中的其他字符，但动态转换模型值。该模块还具有过滤器来修改 ngBind 以显示例如逗号分隔符而不是点。
安装后（bower、npm 或手动）将模块作为依赖项添加到您的应用程序中，然后：
<input type="text" id="txt" ng-model="mynumber" awnum num-sep="," num-fract="2">
<label>mynumber| awnum : 2 : ',' : 'round' : 'true'</label>
我构建了这个模块来处理波兰的价格表格。
【讨论】：
嗨，是否可以使它与 angular 1.2.28 一起使用？【参考方案2】：如果您想将英文数字格式转换为德文数字格式。您可以在打字稿中使用以下代码 -
const number = 123456.789;
console.log(new Intl.NumberFormat('de-DE').format(number));
// expected output: "123.456,79"
您可以在此处找到更多数字格式和详细信息 - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat
【讨论】：
以上是关于在 Angular 中以德语格式输入十进制数“有逗号”效果不佳的主要内容，如果未能解决你的问题，请参考以下文章