角材の進行線形バーがファイヤーベースで更新されない

Question

firebaseを使用して画像をアップロードし、角度素材を使用してスタイルを調整していますが、<md-progress-linear>ディレクティブの値属性を更新する際に問題があります。

変数は、next関数が実行されるたびに更新されます。これは、アップロードが完了するまで数秒ごとです。これはコンソールにvm.imgProgressを記録することで証明できます（私はnext関数でやっています）。しかし、私がフォームフィールドに注目しない限り、ディレクティブの値は更新されません。

ここにいくつかのコードがありますが、役に立つと思います。

HTML

<md-progress-linear md-mode="determinate" value="{{vm.imgProgress}}"></md-progress-linear> 

JS

ここ

angular 
.module('app.posts') 
.controller('PostsController', PostsController); 

PostsController.$inject = ['$firebaseArray', '$window']; 

function PostsController($firebaseArray, $window) { 
    var vm = this; 

    vm.imgProgress = 0; 

    function uploadImage() { 
    var file = document.getElementById('file-input').files[0]; 
    var uploadTask = storageRef.child('images/' + file.name).put(file); 

function next(snapshot) { 
    // Get task progress, including the number of bytes uploaded and the total number of bytes to be uploaded 
    vm.imgProgress = (snapshot.bytesTransferred/snapshot.totalBytes) * 100; 
    console.log('Upload is ' + vm.imgProgress + '% done'); 
    switch (snapshot.state) { 
    case firebase.storage.TaskState.PAUSED: // or 'paused' 
     console.log('Upload is paused'); 
    break; 
    case firebase.storage.TaskState.RUNNING: // or 'running' 
     console.log('Upload is running'); 
    break; 
    } 
} 

function complete() { 
    vm.newPost.imgURL = uploadTask.snapshot.downloadURL; 
} 

uploadTask.on(firebase.storage.TaskEvent.STATE_CHANGED, next, error, complete); 

    } 

} 

Answer 1

ある@camden_kid答えに私の解決策のベース

HTML：

<md-progress-circular md-mode="determinate" value="{{percent}}"></md-progress-circular>    

JS：

 $scope.uploadfile = function (ev) { 

      var file = $scope.mp3; 

      var metadata = { contentType: 'audio/mpeg', }; 
      var uploadTask = storage.ref().child('songs/' + file.name).put(file, metadata); 

      uploadTask.on(firebase.storage.TaskEvent.STATE_CHANGED, 
        function (snapshot) { 

         $timeout(function() { 
          $scope.percent = (snapshot.bytesTransferred/snapshot.totalBytes) * 100; 
         }); 
         console.log('Upload is ' + $scope.percent + '% done'); 
         switch (snapshot.state) { 
          case firebase.storage.TaskState.PAUSED: 
           //console.log('Upload is paused'); 
           break; 
          case firebase.storage.TaskState.RUNNING: 
           //console.log('Upload is running'); 
           break; 
         } 
        }); 
     };