title: Failed to load PDF document - Angular JS - BLOB
body: <p>I am trying to get PDF document from Web API, and want to show in Angular App. Getting "Failed to load PDF document error". 
  I have followed 
  "<a href="https://stackoverflow.com/questions/21628378/angularjs-display-blob-pdf-in-an-angular-app">AngularJS: Display blob (.pdf) in an angular app</a>" post.
  Whereas, i can download the same file successfully by following "<a href="https://stackoverflow.com/questions/24080018/download-file-from-a-asp-net-web-api-method-using-angularjs">Download file from an ASP.NET Web API method using AngularJS</a>" post.</p>
  
  <p>Looks like i am getting the file as "Chunked Transfer Encoded". Somehow this is not getting decoded when trying to show in angular app. Please advise.</p>
  
  <p>Web API Code:</p>
  
  <pre><code>HttpResponseMessage result = null;
          var localFilePath = @"C:\Test.pdf";
  
          if (!File.Exists(localFilePath))
          {
              result = Request.CreateResponse(HttpStatusCode.Gone);
          }
          else
          {// serve the file to the client
              result = Request.CreateResponse(HttpStatusCode.OK);
              result.Content = new StreamContent(new FileStream(localFilePath, FileMode.Open, FileAccess.Read));                
              result.Content.Headers.ContentDisposition = new System.Net.Http.Headers.ContentDispositionHeaderValue("attachment");
              result.Content.Headers.ContentType = new MediaTypeHeaderValue("application/pdf");
              result.Content.Headers.ContentDisposition.FileName = "Test.pdf";
              result.Content.Headers.Add("x-filename", "Test.pdf");
          }
  
          return result;
  </code></pre>
  
  <p>Angular Controller:</p>
  
  <pre><code>   myModule.controller("pdfviewerController", function ($scope, $http, $log, $sce) {
  $http.post('/api/Sample/GetTestFile', {responseType:'arraybuffer'})
   .success(function (response) {      
    var file = new Blob([response], { type: 'application/pdf' });
    var fileURL = URL.createObjectURL(file);
    $scope.content = $sce.trustAsResourceUrl(fileURL);            
   });
  });
  </code></pre>
  
  <p>HTML Template:</p>
  
  <pre><code>&lt;embed ng-src="{{content}}" style="width:200px;height:200px;"&gt;&lt;/embed&gt;
  </code></pre>