pdf - Ember View 以显示 PDF

Question

在我的一个 View 中，我想显示一个可通过 URL 访问的 PDF。无需在浏览器中打开额外的选项卡，也无需下载 PDF(以便在浏览器外查看)即可完成此操作。它应该是可见的嵌入在 Ember 应用程序中。

我想到的是:

使用 URL 获取 PDF 并使其可供 ember 应用程序访问。

使用特殊的“PDF View ”来显示 PDF。

这可能吗？在 Ember 应用程序中显示嵌入的 PDF 有哪些选项？

Answer 1

显示 PDF 与 ember 并没有真正的关系，因为要查看 PDF，您需要在浏览器中安装 PDF 插件(大多数情况下默认安装取决于浏览器)。
也就是说，我可以想象的一个可能的解决方案是创建一个带有 tagName iframe 的自定义 ember View 。您在其上设置 src属性指向引用 PDF 的链接。
例子:

App.PDFView = Ember.View.extend({
  tagName: 'iframe',
  attributeBindings: ['src', 'width', 'height', 'frameborder'],
  src: 'pdffile.pdf',
  width: 800,
  height: 600,
  frameborder: 0
});

我也用过 width , height和 frameborder只是为了方便您可以控制一些 iframe的属性很容易从 ember 中获得。这里有一个工作 demo .
您还可以使用更详细的内容并使用像 http://pdfobject.com/ 这样的 js 库。然后在 View 的 didInsertElement 中初始化钩:

App.PDFView = Ember.View.extend({
  src: 'pdffile.pdf',
  width: 800,
  height: 600,
  didInsertElement: function() {
    new PDFObject({ 
      url: this.get('src'),
      width: this.get('width'),
      height: this.get('height')}
    ).embed(this.get('elementId'));
  }
});

(没有测试后者，但你明白了)
然后用这个 App.PDFView就像模板中的普通 ember View 一样。

{{view App.PDFView}}

或者您可以设置 src , width & height直接从你的模板中，比如

{{view App.PDFView src="pdffile.pdf" width="600" height="800"}}

希望能帮助到你。