1. ホーム
  2. 質問と答え
  3. どの角度JSを通じてダイナミック出荷トラッカーを作成するためのより良い方法は、

どの角度JSを通じてダイナミック出荷トラッカーを作成するためのより良い方法は、

2016-08-05 5 views

答えて

0

長い検索の後、私は追跡のためにHTMLプログレスバーを使用しようとしました。

出荷状況に基づいて進捗の価値を更新することができます。 今のところ、私は$intervalを使って、3秒ごとに進行状況を更新します。

var app = angular.module("progress_app", []); 
 
\t app.controller('testCtrl',function($scope, $interval){ 
 
\t $scope.progress_value=5; 
 

 
\t $scope.heading="Shipping Tracker"; 
 
    $scope.callAtInterval = function() { 
 
     if($scope.progress_value <=100){ 
 
\t \t $scope.progress_value = $scope.progress_value * 2; 
 
\t }else{ 
 
\t \t $scope.progress_value = 5; 
 
\t } 
 
\t  
 
    } 
 

 
    $interval(function(){ $scope.callAtInterval(); }, 3000); 
 
\t });
.tracker { 
 
\t \t width:80% 
 
\t }
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 
</head> 
 
<body ng-app="progress_app" ng-controller="testCtrl"> 
 
\t \t <h3 ng-bind='heading'> </h3><br/><br/> 
 
\t \t <progress value="{{progress_value}}" max="100" class="tracker"> 
 
\t \t </progress> 
 
</body> 
 
</html>

出典

2016-08-08 09:20:31

関連する問題

 関連する問題