Angular JS File Saver использовать для экспорта из данных - PullRequest
Новая
       6

Angular JS File Saver использовать для экспорта из данных

0 голосов
/ 14 мая 2018

Я использовал файл-заставку снизу

bower install angular-file-saver --save

для передачи строки json также в приведенном ниже коде вместо получения innerhtml, как показано ниже, 

$scope.items = [{
    name: "John Smith",
    email: "j.smith@example.com",
    dob: "1985-10-10"
  }, {
    name: "Jane Smith",
    email: "jane.smith@example.com",
    dob: "1988-12-22"
  }];

но это не сработало, и я вывел строку json в один столбец в экспортированном файле 

 var blob = new Blob([document.getElementById('exportable').innerHTML], {
                type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8"
            });
            FileSaver.saveAs(blob, "Report.xls");

мой HTML-код для datatable 

<div class="col-md-12">
            <div id='exportable' ng-controller="getDataTable as showCase">
                <table class="table table-bordered" datatable="" dt-options="showCase.dtOptions" dt-columns="showCase.dtColumns" dt-instance="showCase.dtInstance" class="row-border hover"></table>
            </div>
        </div>

Я использую datable в«exportable» id

как работать с экспортом в excel с файловой заставкой и возможностью обработки данных?

здесь с datatble он экспортируется с выбранной страницей и нумерацией страниц, я хочу только таблицу

может ли кто-нибудь помочь мне решить ее

1 Ответ

0 голосов
/ 14 мая 2018

сначала создайте два div в html, как показано ниже, и создайте ссылку: 

   <a ng-click="exportDataInExcel()">Export</a>
    <div class="col-md-12">
       <div ng-controller="getDataTable as showCase">
          <table class="table table-bordered" datatable="" dt-options="showCase.dtOptions" dt-columns="showCase.dtColumns" dt-instance="showCase.dtInstance" class="row-border hover"></table>
        </div>
    </div>
<div class="col-md-12" hidden>
       <div ng-controller="getDataTable as showCase" id='exportable'>
          <table class="table table-bordered" datatable="" dt-options="showCase.dtOptions" dt-columns="showCase.dtColumns" dt-instance="showCase.dtInstance" class="row-border hover"></table>
        </div>
    </div>

и int ваш контроллер создают функцию, подобную следующей: 

$scope.exportDataInExcel = function(){
    var blob = new Blob([document.getElementById('exportable').innerHTML],{
      type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8"
    });
    FileSaver.saveAs(blob, "Report.xls");
}
...