DEV Community

munir abdullah
munir abdullah

Posted on

I want to use ngx-doc-viewer read from input file

<input type="file" (change)="onFileSelected($event)" />
<ngx-doc-viewer [viewerUrl]="docUrl" [url]="docUrl" viewer="office" style="width:100%;height:50vh;"></ngx-doc-viewer>

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

@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent {
docUrl: any;

onFileSelected(event: Event): void {
const input = event.target as HTMLInputElement;
if (input.files && input.files[0]) {
const file = input.files[0];
const reader = new FileReader();
reader.onload = (e: any) => {
// const arrayBuffer = reader.result as ArrayBuffer;
// const base64String = this.arrayBufferToBase64(arrayBuffer);
this.docUrl = e.target.result;
};
reader.readAsArrayBuffer(file);
}
}

arrayBufferToBase64(buffer: ArrayBuffer): string {
let binary = '';
const bytes = new Uint8Array(buffer);
const len = bytes.byteLength;
for (let i = 0; i < len; i++) {
binary += String.fromCharCode(bytes[i]);
}
return window.btoa(binary);
}

}`

this code note showing the word document for ex...

Top comments (1)