How to preview *.docx and *.xlsx inside the application using Library like 'ngx-doc-viewer2'

Question

It's been 3 days, I am searching for a solution to display my *.docx and *.xlxs file in my angular application. I have an API which is returning the files as blob. Now, I want to use that blob to show the file. I can easily download the file using window.open(blobLink), however, my main task was to view the file. So, I searched and found ngx-doc-viewer and it does not work with the blob link as I currently found and file needed to be publicly accessible. But, my application will run in the local network. So, how can I solve this problem. Here is my *.ts and HTML code below=>
TS

getFile(fileData: File) {
        this.tempBlob= null;
    
        this.ProposalService.getFile(fileData).subscribe(
            (retFileData: any) => {
                this.tempRetFileData = retFileData;
            },
            (err: Error) => {
                
            },
            () => {
                const blob = new Blob([this.tempRetFileData], { type: this.contentType });
                this.docURL = window.URL.createObjectURL(blob);
            }
        );
    }

HTML

<ngx-doc-viewer [url]="docURL" viewer="google" style="width:100%;height:50vh;"></ngx-doc-viewer>

Answer 1

For blob type use viewer="mammoth":

<ngx-doc-viewer [url]="docURL" **viewer="mammoth"** style="width:100%;height:50vh;"></ngx-doc-viewer>

To use mammoth, also add:

npm install mammoth --save

and make sure mammoth.browser.min.js is loaded. For the angular/cli you would add the following in angular.json:

    "scripts": [
        "node_modules/mammoth/mammoth.browser.min.js"
    ]