Display ms word file in html using angular

Question

How can I display Microsoft Word file in HTML page using either Angular or JavaScript. Please suggest any libraries which provide this functionality.

Answer 1

No browsers currently have the code necessary to render Word Documents, and as far as I know, there are no client-side libraries that currently exist for rendering them either

However, if you only need to display the Word Document, but don't need to edit it, you can use Google Documents' Viewer via an to display a remotely hosted .doc/.docx.

<iframe src="http://docs.google.com/gview?url=http://remote.url.tld/path/to/document.doc&embedded=true"></iframe>

Example: jsfidle

However, if you'd rather have native support, in most, if not all browsers, I'd recommend resaving the .doc/.docx as a PDF file Those can also be independently rendered using PDF.js by Mozilla.

Edit:

Huge thanks to fatbotdesigns for posting the Microsoft Office 365 viewer in the comments.

<iframe src='https://view.officeapps.live.com/op/embed.aspx?src=http://remote.url.tld/path/to/document.doc' width='1366px' height='623px' frameborder='0'>This is an embedded <a target='_blank' href='http://office.com'>Microsoft Office</a> document, powered by <a target='_blank' href='http://office.com/webapps'>Office Online</a>.</iframe>

Live Examples:

Google Docs Viewer

Microsoft Office Viewer

Answer 2

So what I found from my research is you can not display a word file using java script or angular, it only opens up a dialog box to download the file.

Here are some links backing my conclusion. display doc file in HTML link1
display doc file in HTML link2

As an alternate what you can do is convert word file to HTML and preview it in browser. Mammoth.JS is the best option for this.