如何在 angular 8 中显示文件

Question

我想显示 Angular 组件中具有不同扩展名的文件。我为此使用什么模块？我复习了以下modules.But个都有问题

ngx-文档查看器：https://www.npmjs.com/package/ngx-doc-viewer
ngx-extended-pdf-viewer: https://www.npmjs.com/package/ngx-extended-pdf-viewer
网络查看器：https://www.pdftron.com/webviewer/demo/

Answer 1

你可以使用angular-file-viewer

此包支持 PDF、JPEG、PNG、MP4

安装

npm i @taldor-ltd/angular-file-viewer ng2-pdf-viewer

用法

将 AngularFileViewerModule 添加到模块的导入中

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AngularFileViewerModule } from '@taldor-ltd/angular-file-viewer';

import { AppComponent } from './app/app.component';

 @NgModule({
  imports: [BrowserModule, AngularFileViewerModule],
 declarations: [AppComponent],
 bootstrap: [AppComponent]
 })

 class AppModule {}

platformBrowserDynamic().bootstrapModule(AppModule);

然后在你的组件中使用它

（PDF 样本）

import { Component } from '@angular/core';

import { FileMimeType } from '@taldor-ltd/angular-file-viewer';

@Component({
selector: 'app-root',
template: `
<tld-file-viewer [src]="src" [type]="type"></tld-file-viewer>`

})
export class AppComponent {
src = 'http://www.africau.edu/images/default/sample.pdf';
 type = FileMimeType.PDF;
}

documentation

如何在 angular 8 中显示文件

how to show files in angular 8

file

viewer

angular