如何在AngularJS MD中使用<md-progress-linear>？

我在我的AngularJS应用程序中使用Material Design，我想在加载页面时添加进度栏。如何在AngularJS MD中使用<md-progress-linear>？

MD使用md-progress-*指令获得加载条：

<md-progress-linear md-mode="determinate" value="..."></md-progress-linear>

在我的应用我试图让$viewContentLoaded加载进度完成：

HTML：

<html ng-app="app"> 
    <body ng-controller="AppCtrl"> 
     <md-progress-circular ng-if="determinateValue === 100" md-mode="determinate" value="{{determinateValue}}"></md-progress-circular> 
     ... 
    </body> 
</html>

JS：

'use strict'; 
angular.module('app', ['ngMaterial', 'ngAnimate']) 
.controller('AppCtrl', function ($scope) { 
    $scope.determinateValue = 0; 
    $scope.$on('$viewContentLoaded', function(){ 
     $scope.determinateValue = 100; 
    }); 
});

但它不起作用，我没有得到任何错误。

ps。 <md-progress-linear>标签将从DOM中消失。

来源

2015-11-02 Mustapha Aoussar

首先，使用md-mode="indeterminate"作为你的加载是二进制的，只有两种状态。摆脱ng-if并使用绑定到$scope.determinateValue的value属性。所以：

 <md-progress-circular md-mode="indeterminate" value="determinateValue"></md-progress-circular>

我会将determinateValue重命名为更精确和反射的东西。此外，标签消失，导致确定值始终在某个点被分配到100，即您的内容正在加载

来源

2015-12-02 05:07:13 sjt003

如何在AngularJS MD中使用<md-progress-linear>？

回答

相关问题