Question

我正在尝试使用angularJS

设置条形图的进度

使用System.ArgumentOutOfRangeException将变量连接到输入。

ng-model

javascript

angular.module('progressTest', []); angular.module('progressTest') .controller('mainController', function ($scope) { $scope.percent = 0; })

html

模型正在更新，但对进度条值没有影响。

编辑：忘记添加此codepen

Answer 1

<强>更新

抱歉，我认为这与控制器有关。但主要问题是aria-valuenow和width彼此不同步。不够来绑定aria-valueNow，但绑定width 样式也是必需的。以下代码有效，因为我们使用width

绑定ng-style

  <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="{{ mainCtrl.percent }}" aria-valuemin="0" aria-valuemax="100"
  ng-style="{'width':mainCtrl.percent+'%'}">

与上述更新一起使用的原始答案。

当您使用controller as alias语法时，应使用this代替$scope。请尝试以下代码。它会起作用。

angular.module('progressTest', []);

angular.module('progressTest')
          .controller('mainController', function () {
  this.percent = 0;
})

AngularJs更新Bootstrap进度条

1 个答案: