Question

我想在我的页面上显示PDF文件。为此，我使用像这样的对象标签，它可以工作：

<div style="width:100%;height:100%;position:relative;background-color:white">
  <object data="http://eloquentjavascript.net/Eloquent_JavaScript.pdf" 
    type="application/pdf" width="100%" height="100%">
    <param name="view" value="Fit" />
  </object>
</div>

但我需要动态设置对象数据，如下所示：

<div style="width:100%;height:100%;position:relative;background-color:white">
  <object data="{{url}}" 
    type="application/pdf" width="100%" height="100%">
    <param name="view" value="Fit" />
  </object>
</div>

我已经定义了网址，但它没有显示PDF文件。我创造了一个我想做的例子： http://plnkr.co/edit/6xE1Q7YzcD8eB0K4lP8Y

请建议我做错了什么？

谢谢和问候，埃杜

Answer 1

似乎在Chrome中运行良好。

某些浏览器（IE）解析{{url}}" before Angular got a chance to replace the binding by the bound value which results in an error because {{url}}`不是有效的网址。

您可以使用

来阻止这种情况

<object [data]="url"

或

<object [attr.data]="url"

或

<object attr.data="{{url}}"

Angular2试图显示PDF

1 个答案: