2016-03-21 7 views
0

ユーザーがファイルをダウンロードしたときのUI読み込みバーを表示しようとしています。ダウンロードファイルのコードは既に動作していますが、既にAngularでコンフィグレーションされたUIの進行状況インジケータがあるため、bool値をtrueまたはfalseに設定してプログレスバーを表示/削除するだけです。私のコードは次のようになります。

$scope.getCompletedJobs = function() { 

    $rootScope.blockUI = true; 

    var params = { 
     StartDate: $scope.StartDate, 
     EndDate: $scope.EndDate 
    }; 

    location.href = apiEntry.linkHref('get-completed-transfer-jobs') + "?" + $httpParamSerializer(params); 

    $rootScope.blockUI = false; 
}; 

私の問題は、それが実行されます後LOCATION.HREFがfalse $ rootScope.blockUI =を引き起こし、すぐに戻り、明らかです。実行するには、有効な$ rootScope.blockUI = false; location.hrefが完了したときのみです。私はいくつかの種類の約束/約束のパターンを使用する必要があると信じていますが、Angularを使用してこれを実装する方法は完全にはわかりません。

UPDATED ANSWER

完了作業のコードは今、この

$scope.getCompletedJobs = function() { 

    $rootScope.blockUI = true; 

    var params = { 
     StartDate: $scope.StartDate, 
     EndDate: $scope.EndDate 
    }; 

    $http.get(apiEntry.linkHref('get-completed-transfer-jobs') + "?" + $httpParamSerializer(params)) 
     .then(function (response) { 
      //do something here with the response 
      $rootScope.blockUI = false; 

      var a = document.createElement('a'); 
      a.href = 'data:attachment/csv;charset=utf-8,' + encodeURI(response.data); 
      a.target = '_blank'; 
      a.download = 'CompletedTransferJobs.csv'; 
      document.body.appendChild(a); 
      a.click(); 
     }); 
}; 

答えて

1

のように見えますが、おそらくAPIエンドポイントにページをリダイレクトする必要はありませんが、代わりにメイクAリクエストしてください。

$scope.getCompletedJobs = function() { 

     $rootScope.blockUI = true; 

     var params = { 
      StartDate: $scope.StartDate, 
      EndDate: $scope.EndDate 
     }; 

$http.get(apiEntry.linkHref('get-completed-transfer-jobs') + "?" + $httpParamSerializer(params)).then(function(response) { 
//do something here with the response 
$rootScope.blockUI = true; 
}) 



    }; 
+0

プログレスローダーは期待通りに機能しますこのapprouchを送信しますが、ファイルはもうダウンロードされません。あなたのコードには何がありますか?ありがとう – FaNIX

+0

私は参照してください。あなたは本当にこのときのローダーを持つことはできません。あなたがそれについて考えるとき、あなたはページに実際にapiの応答ではないリクエストを行います。したがって、location.hrefを再度使用することはできますが、ローダーを使用しないでください。意味はありません。 –

1
sertvicename.getData().then(function(data){ 
    //do what you want with data here 
    //false logic come here after 

    $rootScope.blockUI = false;  

}).catch(fucntion(){ 

//if any error 
}) 
関連する問題