AngularJS ng-src / ng-data-attr is not compiled

Question

Hello I'm requesting a pdf from a webservice and want to show pdf when the request is finished and I've generated an ObjectUrl. My problem is, that the ng-src in "embed" or the ng-data-attr in "object" is not compiled and the browser is downloading url/{{pdfData}}

Here's my DOM:

 <div ng-if="pdfData != ''">

    <embed ng-src="{{pdfData}}" style="width:200px;height:200px;" type="application/pdf"></embed>

    <!--<object ng-bind="pdfData" data="{{pdfData}}" type="application/pdf" width="100%" height="800px">-->
    <br>Objekt:
   <object ng-attr-data="{{pdfData}}" type="application/pdf" width="100%" height="800px">

My JS Code:

$http.post('url', { }).
   then(function(response) {
      var byteCharacters = atob(response.data.trim())
      var byteNumbers = new Array(byteCharacters.length);
      for (var i = 0; i < byteCharacters.length; i++) {
         byteNumbers[i] = byteCharacters.charCodeAt(i);
      }
      var byteArray = new Uint8Array(byteNumbers);
      var blob = new Blob([byteArray], {type: 'application/pdf'});

      var blobUrl = URL.createObjectURL(blob);

      $scope.pdfData = $sce.trustAsResourceUrl(blobUrl);

      }, 
      function errorCallback(response) {
           console.log(response);
      });

When I'm running the above code it works fine on Google Chrome, but not in IE/Firefox.

I've also tried an own directive like it is described here: angularjs expression in html <object> tag

But then I have the problem, when I'm creating a new src-url for another PDF, the new pdf I assign to $scope.pdfData is not loaded in the embed or object control.

Thanks for your help