Question

我正在开展一个项目，我们需要做一些准确的数字计算但我们也必须以漂亮的格式向用户显示数字。

这是HTML代码

 <span> {{ getTotalStocksValue() }} %</span>   
    <button data-ng-click="redistribute()">Redistribute</button>
    <form action="">
        <input type="text" data-numeric-input-directive   data-ng-repeat="stock in stocks" data-ng-model="stock.value">
    </form>

我们显示一些具有其价值的股票，并且可以手动更改股票的价值。我们使用getTotalStocksValue()函数显示跨度中的股票总数值。并且重新分配按钮重新分配股票价值，因此总价值将为100％。

要求是在输入中以小数点后2位显示股票价值但是我们还应该将库存值保存在4个十进制宫殿中，因为我们需要在getTotalStocksValue函数中执行更准确的计算。例如，如果我们有3只股票，每只股票的价值为33.33 总数为99.99，而如果用户将每个股票的股票价值更改为33.3333，则总数应该舍入为100（如果为99.9999）。我不知道在Angular中是否可以实现这一点。我唯一的想法是将输入中的股票值显示为4位小数，并将它们显示在小数点后2位的范围或div中。任何想法或建议？

Answer 1

尝试使用

let parsedValue = parseFloat(number).toFixed(4);

现在，数字中的值将四舍五入到小数点后4位，并显示＆＃34; number＆＃34;在视图中使用角度十进制管道

number | number:'1.2-2'

希望这有帮助

Answer 2

我认为它需要一个将值作为副本处理的指令。

您可以将<stock-value value="stock.value"></stock-value>替换为上面注入了本地固定小数<input>的{{1}}标记：

ng-model

指令：

<div ng-repeat="stock in stocks">
  <stock-value value="stock.value"></stock-value>
</div>

看到这个plunkr - ＆gt;的 http://plnkr.co/edit/P9uHZwTzgK9mJkRHRrl9?p=preview

用户看到两位十进制固定值，原始值未被截断，但如果用户输入新值，旧值将被覆盖最多4位小数。

Answer 3

只需使用官方角度DecimalPipe。

yourNumber | number:'1.2-2'将始终显示至少包含一个整数位的数字，并始终显示2位小数。

如何在2位小数处显示数字，但在Angular中将其存储在4位小数

3 个答案: