ng-cloak not working properly

Question

In my angular app, I'm displaying a pdf using <object> tag.

<object ng-cloak data="data:application/pdf;base64,{{tab.documentdata}}"
         width="100%"
         height="5000"  
         standby="Loading document...">
         Oops, you have no PDF viewer enabled
</object>

The {{tab.documentdata}} is the base64 encoded data which is the response of a server request.

Issue

Even after adding ng-cloak for the object tag. I can see http request like below.

How to restrict the request being send before replacing the angular expression.

data:application/pdf;base64,{{tab.documentdata}} 

Answer 1

I think the best way would be like

<object ng-attr-data="data:application/pdf;base64,{{tab.documentdata}}"
         width="100%"
         height="5000"  
         standby="Loading document...">
         Oops, you have no PDF viewer enabled
</object>