如何在AngularJS中显示百分比文字进度条？

当我们上传任何东西时，我试图在我的页面中包含百分比进度条。进度条工作正常，但问题是它没有显示百分比文本。它只是显示％符号。谁能帮我这个。如何在AngularJS中显示百分比文字进度条？

<div class="col-md-12"> 
    <span ng-if="submittedArt && !myFile" class='erroMassge'>Please choose an image to upload</span> 
    <span id="percentage" ng-show="progressBarEdit">{{uploadprogress | number: 0}} %</span> 
    <md-progress-linear class="md-warn" md-mode="buffer" value="{{uploadprogressartedit}}" ng-show="progressBarEdit"></md-progress-linear> 
</div>

Controller.js

uploadEventHandlers: { 
    progress: function(e) { 
     if (e.lengthComputable) { 
      $scope.uploadprogressartedit = (e.loaded/e.total) * 100; 
     } 
    } 
}

来源

2017-09-04 Musheer Aiman

您在哪里定义“uploadprogress”我认为这应该是“uploadprogressartedit” – jitender

@jitender ...我将“uploadprogress”更改为“uploadprogressartedit”，但它的工作方式与以前一样。 –

试试这个：

在你的HTML：

<md-progress-linear class="md-warn" md-mode="buffer" value="{{showProgress()}}" ng-show="progressBarEdit"></md-progress-linear>

在你的控制器：

showProgress:function(){ 
uploadEventHandlers: { 
    progress: function(e) { 
     if (e.lengthComputable) { 
      $scope.uploadprogressartedit = (e.loaded/e.total) * 100; 
     } 
    } 
} 
return $scope.uploadprogressartedit; 

}

当您从html中动态调用返回值的方法时，它将在运行时绑定该值。您必须在任何返回uploadprogressartedit值的方法中进行uploadEventHandler进度计算。还要确保你创建的方法应该在范围内定义。

来源

2017-09-04 06:47:02

如何在AngularJS中显示百分比文字进度条？

回答

相关问题