5 AngularJS Microsoft Word & Excel Integrations

Handsontable JavaScript Spreadsheet Most popular component for web apps
Sam Deering Sam Deering (updated ) Angular Modules Tips

In today’s post we’ve had a super quick look if developers are still integrating with MS Word and MS Excel. The short answer is no – there doesn’t seem to be much going on with Microsoft anymore especially with HTML5 WYSIWYG’s becoming more popular. The only thing appearing sometimes is CSV’s format for data and importing that into tables, however it seems more appropriate to use XML or JSON for this. Either way was worth a quick look.

1. ngCSV

An AngularJS simple directive that turns arrays and objects into downloadable CSV files.
An AngularJS simple directive that turns arrays and objects into downloadable CSV files.
Github Demo

2. AngularJS CSV Binding

Easily bind arrays of data to a textarea with CSV formating.
Easily bind arrays of data to a textarea with CSV formating.
Github Demo

3. Angular-UI ngHandsontable

Include your Excel data in a table using Angular.
Include your Excel data in a table using Angular.
Github Demo

4. Export HTML table to Excel in AngularJS

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
myApp.factory('Excel',function($window){
        var uri='data:application/vnd.ms-excel;base64,',
            template='<!--[if gte mso 9]&gt;{worksheet}&lt;![endif]--><table>{table}</table>',
            base64=function(s){return $window.btoa(unescape(encodeURIComponent(s)));},
            format=function(s,c){return s.replace(/{(\w+)}/g,function(m,p){return c[p];})};
        return {
            tableToExcel:function(tableId,worksheetName){
                var table=$(tableId),
                    ctx={worksheet:worksheetName,table:table.html()},
                    href=uri+base64(format(template,ctx));
                return href;
            }
        };
    })
    .controller('MyCtrl',function(Excel,$timeout){
      $scope.exportToExcel=function(tableId){ // ex: '#my-table'
            $scope.exportHref=Excel.tableToExcel(tableId,'sheet name');
            $timeout(function(){location.href=$scope.fileData.exportHref;},100); // trigger download
        }
    });
 

Gist Code

5. KenduUI Export to Excel

The Kendo UI TreeList widget enables display of self-referencing tabular data, and allows sorting, filtering, and editing of data.
The Kendo UI TreeList widget enables display of self-referencing tabular data, and allows sorting, filtering, and editing of data.
Docs Demo

Other useful code examples:

Sam Deering

Sam Deering

Sam is a web developer, online entrepreneur and investor. In his spare time he enjoys coding, playing chess and sharing what he learns with others.

5 thoughts on “5 AngularJS Microsoft Word & Excel Integrations”

  1. I am ableto download excel from angularjs but after downloading hyperlinks are not retained in excel . i am using angularjs and backend java

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *