비디오 로딩 메시지 응답이 백엔드

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> 

, 즉 너무 succesfull입니다. 그러나 문제는 내 비디오 크기가 크거나 인터넷이 너무 느린 경우입니다. 그냥 유휴 상태이며 응답이 백엔드에서 나올 때까지 비디오로드와 같은 intimation 또는 gif 이미지를 수행해야합니다. 도움이 필요하다.

Answer 1

이 같은 스피너 여부, 뭔가 표시할지 여부를 나타내는 플래그를 설정할 수 있습니다 : 당신의 HTML 어딘가에 다음

$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; 
    }); 
} 

을 그리고

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