Pete
Pete

Reputation: 113

How to display a Word Document in AngularJS that is stored in SQL Server as a base 64 encoded string

I'm trying to display a Word Document in AngularJS that is stored in SQL Server as a base64 encoded string and I'm not quite certain how to go about it. Here's what I have so far:

I'm using a $resource action defined as such:

getFile: { url: svcFileURL + "(:FileId)?OversightId=:Id", method: "GET",    
withCredentials: true, responseType: "arraybuffer", headers: { 'Content-
Type':  'application/json' } },

and in my Angular Controller I'm setting a few properties:

$scope.img_url = "data:application/vndopenxmlformats-officedocumentwordprocessingmldocument;base64";
$scope.imageData = $scope.items.value[0].Files[0].FileData;

and then in my view I'm simply doing this:

 <img ng-src="{{img_url}},{{imageData}}">

with no luck. I'm wondering if I'm going about this the correct way. Any help is much appreciated.

Thanks so much,

Pete

Upvotes: 0

Views: 1235

Answers (1)

Dirk Vollmar
Dirk Vollmar

Reputation: 176229

Things aren't as simple as your current solution suggests. Word documents cannot be displayed as an image by the browser, they first need to be rendered, i.e. you need a component that takes the document text, images, styles and direct formatting instructions stored in the Word document and then calculates the layout, formatting, line wrapping, page breaks etc. Rendering documents is highly complex, so you would not implement that on your own.

You basically have to options to show your document in the browser:

  • Render the document using an existing tool, such as Word Online, or,
  • Convert the document (server-side or in batch) into a format that can be displayed by the browser, e.g. PNG, or PDF.

Upvotes: 1

Related Questions