angular-bootstrap progressbar 进度显示不正确

Question

我运行在外部window上进行了一系列模拟，每次模拟完成后，我都会在主window上增加一个进度值（一切都通过IPC发生通讯）。

整个机制运行良好，进度条上方和内部的视图是正确的，而进度条本身显示丑陋的百分比区域。

以此为例（真实案例截图）：

指令是：

<uib-progressbar ng-if="typeof(progressMax) !== 'string'" 
  class="progress-striped danger" 
  max="100" 
  value="progress*100/progressMax" 
  type="danger">
    <i>{{progress}} / {{progressMax}} ({{progress*100/progressMax}}%)</i>
</uib-progressbar>

progressMax 值在按下按钮时设置（因此在显示进度条时），进度从 0 开始并达到 progressMax。

转换已正确完成，如视频所示，但显然，进度条显示的似乎是 90/1000 而不是 90/100。

我运行在一个使用 Webpack 和 AngularJS（和 Babel）的 ElectronJS 项目上，我不确定这是否相关。

我已经检查过其他类似的 bootstrap 问题，但到目前为止没有一个对我有帮助（另外，设置 max="progressMax" 也不起作用并重现了同样的问题）。

Answer 1

我找到问题了。

实际上没有任何代码相关：我的代码是正确的。

问题是 {{progress}} 更新太快，因此视图没有足够的时间来处理和更新数据。

同样，如果您完成一个进度条并且在短时间后将其进度设置为 0，则可能会遇到另一个错误：您会看到进度条倒退（从 100 到 0），并且当 {{progress}} 符合当前栏状态时，最终再次继续。

简而言之，解决方案是彻底改变数据收集比率：我没有频繁增加进度值，而是将我的主线程设置为仅发送 100 个数据包的集合，这样进度增加是速度较慢，因此视图有足够的时间进行更新。

angular-bootstrap progressbar 进度显示不正确

angular-bootstrap progressbar progress shown is incorrect

javascript

twitter-bootstrap

angularjs

angular-bootstrap

electron