загрузка видео сообщение, пока ответ не приходит от бэкэнда

Question

Видео Upload.js

var json = { 
        "request": { 
         "service":{ 
          "servicetype":servicetype, 
          "session_id": session_id 
         },  
         "data":{  
          "rolename":rolename 
         } 
        } 
       }; 


       FileService.uploadFile(json, file).then(function(res){ 
            console.log(JSON.stringify(res)); 

        if(res && res.status.code == 0) { 
         $scope.getVideo(res.data.mediaids[0]); 
         $scope.getAll(); 
        } else FlashService.Error(res.status.message, true); 
       }); 
      } 

Видео HTML:

<div class="row"> 
     <video ng-if="videoSource.length > 0" vg-src="videoSource" 
       preload='metadata' controls></video> 
     <div class="file-upload-wrapper"> 
      <div class="file-video-upload"> 
       <input type="file" file-model="video" name="file" class="video"/> 
      </div> 
     </div> 
     <div class="file-tags"> 
      <ul> 
       <li ng-repeat="video in files | filter :'video'" > 
        <div class="file-tag-baloon"> 
         <span> 
          <a ng-click="getVideo(video.id);">{{video.filename}}</a> 
         </span> 
         <span><a ng-click="removeVideo(video.id)">x</a></span> 
        </div> 
       </li> 
      </ul> 
     </div> 
    </div> 

Я сделал видео загрузки, используя мой запрос бэкенда службы, то есть слишком успешное. Но проблема иногда возникает, если размер моего видео большой или интернет слишком медленный. Он просто бездействует, и мне нужно делать интуицию или gif-изображение, например, загрузку видео до тех пор, пока ответ не поступит из бэкэнд. Нужна помощь.

Answer 1

Вы можете установить флаг, чтобы указать, следует ли отображать блесну или нет, что-то вроде этого:

$scope.getVideo = function(id){ 
    $scope.displayLoadImage = true; // spinner flag 

    FileService.uploadFile(json, file).then(
    function(res){ // on success 
     // Do your onsuccess stuff here 
    }, function(error) { 
     // Do your onsuccess stuff here 
    }).finally(function()){ 
     // The finally statement is executed regardless of result 
     $scope.displayLoadImage = true; 
    }); 
} 

А потом где-то в HTML

<div ng-show="displayLoadImage">... display spinner...</div>