Use FileSaver page data export to excel

Before using FileSaver.js wrote in a blog to read and write files, this share is achieved using FileSaver the front page export data to excel

First introduced fileSave.js   

import '~/lib/file-saver/dist/FileSaver.min.js';

    html:  <table class="table tb report-table-wrapper refresh" id="exportable">
                <thead>
                <tr class="tb-head fix-top-two tr-nowrap">
                    <Th class = "text-center"> area number </ th>
                    <Th class = "text-center"> zone name </ th>
                    <Th class = "text-center"> branch number </ th>
                    <Th class = "text-center"> Title branch </ th>
                    <th class="text-center">现金</th>
                    <Th class = "text-center"> Card </ th>
                    <th class="text-center">微信</th>
                    <Th class = "text-center"> Alipay </ th>
                    <Th class = "text-center"> member (gift) </ th>
                    <Th class = "text-center"> member (coupon) </ th>
                    <Th class = "text-center"> US Mission takeaway pay </ th>
                    <-! <Th class = "text-center"> coupon payments </ th> ->
                    <Th class = "text-center"> US Mission to pay </ th>
                    <Th class = "text-center"> bank redeem </ th>
                    <th class="text-center">挂账</th>
                    <th class="text-center">合计</th>
                    <!--<th class="text-center">操作</th>-->
                </tr>
                </thead>
                <tbody ng-if="!$ctrl.isRenderTableContent"><tr></tr></tbody>
                <tbody ng-if="$ctrl.isRenderTableContent">
                <tr class="tb-body tr-nowrap"  ng-repeat="item in $ctrl.dataList1">
                    <td class="text-center" >{{item.areaId}}</td>
                    <td class="text-center">{{item.areaName}}</td>
                    <td class="text-center" >{{item.shopId}}</td>
                    <td class="text-center">{{item.shopName}}</td>
                    <td class="text-center">{{item.xj}}</td>
                    <td class="text-center">{{item.yhk}}</td>
                    <td class="text-center">{{item.wx}}</td>
                    <td class="text-center">{{item.zfb}}</td>
                    <td class="text-center">{{item.hycz}}</td>
                    <td class="text-center">{{item.hyq}}</td>
                    <td class="text-center">{{item.mtwmzf}}</td>
                    <!--<td class="text-center">{{item.yhqzf}}</td>-->
                    <td class="text-center">{{item.mtzf}}</td>
                    <td class="text-center">{{item.yhjfdh}}</td>
                    <td class="text-center">{{item.gz}}</td>
                    <td class="text-center">{{item.hj}}</td>
                </tr>
                </tbody>
            </table>

　　

js:       

  var BLOB = new new Blob ([document.getElementById ( ' exportable ' ) .innerText], {// the id to acquire all the child nodes have the following text exportable

          type: "file application / vnd.openxmlformats-officedocument.spreadsheetml.sheet; charset = UTF-. 8" }); // file type 

 　　　 saveAs (BLOB, "press cashier Summary .xls"); // save data to excel using saveAs