title: How to trigger Spinner for file download or How to download file in browser if AngularJS $resource response received as an attachement with file name
body: <p>I'm able to download successfully using below line of code in AngularJS controller. </p>
  
  <pre><code>$window.location.href =$rootScope.urlBase+'/dios/download/lineitemexcel/'+$routeParams.id
  </code></pre>
  
  <p>But, when data is large and it is taking longer time, for this reason I need to enable angular-Spinner. No way I could find a way to start spinner before the call and it should finish after file download finished in the browser.</p>
  
  <p>Root Problem: How can I enable spinner with existing plugin in the project angular-spinner or usSpinnerService? if this has a solution I dont have next question.</p>
  
  <p>To Solve this problem, I have gone through existing spinner working flow.
  Spinner is working if there is <code>$resource</code> call.</p>
  
  <p>Hence above url I tried by forming factory call like below:</p>
  
  <p><strong>Service:</strong></p>
  
  <pre><code>factory('Dios', ['$resource','$rootScope',
          function($resource, $rootScope){
              return $resource($rootScope.urlBase+'/dios/:id/:status/:third/:fourth/:fifth/:pageNo', {}, {
                  get: {
                      method: 'GET'
                  },
                  update: {
                      method: 'PUT'
                  },
                  getexcel: {
                      method: 'GET',
                      transformResponse: function(data, headers,status){
                          var dataTransformed = {};
                          dataTransformed.data=data;
                          dataTransformed.headers=headers;
                          dataTransformed.status=status;
                          return dataTransformed;
                      }
                  }
              });
          }])
  </code></pre>
  
  <h2><strong>Controller:</strong></h2>
  
  <pre><code>Dios.getexcel({dios:'dios',third:'download',fourth:'lineitemexcel',fifth: $routeParams.id},function(data){
                  console.log(data);
  ]);
  </code></pre>
  
  <p>Using above factory call rest call with an Id of an Object. That Object I need to retrieve and process using Apache POI JAVA library , and Apache POI library will return as an attachement with response header properties in dev tools network tab as follows:</p>
  
  <blockquote>
    <p>HTTP/1.1 200</p>
    
    <p>X-Content-Type-Options: nosniff</p>
    
    <p>X-XSS-Protection: 1; mode=block</p>
    
    <p>Cache-Control: no-cache, no-store, max-age=0, must-revalidate</p>
    
    <p>Pragma: no-cache</p>
    
    <p>Expires: 0</p>
    
    <p>X-Frame-Options: DENY</p>
    
    <p>Access-Control-Allow-Origin: <a href="http://10.218.39.45:9000" rel="nofollow noreferrer">http://10.218.39.45:9000</a></p>
    
    <p>Access-Control-Allow-Credentials: true</p>
    
    <p>Access-Control-Allow-Methods: POST, GET, PUT, OPTIONS, DELETE</p>
    
    <p>Access-Control-Allow-Headers: Content-Type,X-Requested With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers</p>
    
    <p>Access-Control-Expose-Headers:
    1,Access-Control-Allow-Origin,Access-Control-Allow-Credentials</p>
    
    <p>Content-Disposition: attachment;
    filename=LineItems-of_IO-1553-8531Testing_2018-09-18.xlsx</p>
    
    <p>Content-Type: application/vnd.ms-excel</p>
    
    <p>Transfer-Encoding: chunked</p>
    
    <p>Date: Tue, 18 Sep 2018 08:33:46 GMT</p>
  </blockquote>
  
  <p>In this way I'm able to get spinner but , I am not sure how to download response received as file with specified name in response headers.</p>
  
  <p>using <code>transformResponse:</code> I am expecting responseheaders info, but it is not getting attached to headers in <code>transformResponse:</code>.</p>
  
  <p>So Kindly help me to get spinner is getting triggered for <code>window.location.href=url</code> or help me how download the received data through <code>$resource</code>.</p>