Angular download file from server

Question

I have a application that has java on play framework as backend and angular as frontend.

I have an end point in java that will show a pdf when accessing the endpoint. However I will prefer to use angular to download the file.

Java backend is something like this

response().setContentType("application/pdf");
response().setHeader("Content-Disposition", "inline; filename='report.pdf'");
return ok(byteArrayOutputStream.toByteArray());

The angular frontend is something like this

$http({method: 'GET', url: 'report/2'}).
success(function(data, status, headers, config) {
    var hiddenElement = document.createElement('a');
    var str = String.fromCharCode.apply(null, new Uint8Array(data));
    hiddenElement.href = 'data:application/pdf;base64,' + str;
    hiddenElement.target = '_blank';
    hiddenElement.download = 'myFile.pdf';
    hiddenElement.click();  
})

However, when I downloaded the file, the content is not there anymore. Not sure if it's an decoding issue.

Thanks in advance for the help.