如何在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>？

回答

相關問題