Angular $http $resource equivalent for PDF GET request

Question

My Angular project use $resource for all the request I make to the Web API, but I was looking to figure out how to handle the data from a request for PDF, looking on here I found a snippet that works perfectly using $http, I am being trying to get the same result from $resource but not success there:

        $http.get('/api/pdf/shipper', 

        {responseType:'arraybuffer'})
          .success(function (response) {
             var file = new Blob([(response)], {type: 'application/pdf'});
             var fileURL = URL.createObjectURL(file);
             $scope.content = $sce.trustAsResourceUrl(fileURL);
    });

Works perfectly using the $sce service to validate the URL to the $scope.content I use in the pop window. The problem is when I use $resource build on the service for all the request I use on the page:

        InvoicePDF: $resource('/api/pdf/invoice', {},  {  
            method: 'GET',
            headers: {
                accept: 'application/pdf'
            },
            responseType: 'arraybuffer',
            cache: true,
            transformResponse: function (data) {
                var pdf;
                if (data) {
                    pdf = new Blob([data], {
                        type: 'application/pdf'
                    });
                }
                return {
                    response: pdf
                };
            }
        })

then I called form the controller

            SAJAPdata.InvoicePDF.get().$promise.then(function(pdf) {

            $scope.content = $sce.trustAsResourceUrl(pdf);

        });

but not success Angular complains about [$sce:itype] Attempted to trust a non-string value in a content requiring a string: Context: resourceUrl

Any suggestion will be appreciated

Answer 1

Why not just use a normal anchor tag with ng-href

https://docs.angularjs.org/api/ng/directive/ngHref