HTML-Tabelle in Textdatei mit angularjs exportieren

Question

Ich arbeite an einem Projekt, das HTML-Tabelle in Textdatei exportiert werden muss. Im Folgenden ist eine vereinfachte Version des HTML-Codes:

<table> 
    <thead> 
     <tr> 
      <th>Code</th> 
      <th>First Name</th> 
      <th>Last Name</th> 
      <th>Age</th> 
      <th>Date1</th> 
      <th>Date2</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr ng-repeat="employee in employees"> 
      <td>{{employee.code}}</td> 
      <td>{{employee.firstName}}</td> 
      <td>{{employee.lastName}}</td> 
      <td>{{employee.age}}</td> 
      <td><input type="text" class="datepicker" ng-model="employee.date1" datepicker /></td> 
      <td><input type="text" class="datepicker" ng-model="employee.date2" datepicker/></td> 
     </tr> 
    </tbody> 
</table> 

Das erwartete Ergebnis wie diese in einer Textdatei (mit Spalten ausgerichtet schön) aussehen sollte: mit

Code firstName lastName Age  Date1   Date2 
001  x   y  25  2016/01/01  2016/04/04 
... 

Ich versuchte, den „klassischen“ Weg jquery, aber es interpretiert keine Werte in meinen tds. Also suche ich nach einer eckigen Anweisung oder so, um dieses Problem zu lösen. Dank ..

Answer 1

Ein ziemlich geradlinig Weg, es zu tun, würde die FileSaver.js

Angenommen, Ihre Tabelle wie folgt verwenden ist,

<table id="demo-table"> 
    <thead> 
     <tr> 
      <th>Code</th> 
      <th>First Name</th> 
      <th>Last Name</th> 
      <th>Age</th> 
      <th>Date1</th> 
      <th>Date2</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr ng-repeat="employee in employees"> 
      <td>{{employee.code}}</td> 
      <td>{{employee.firstName}}</td> 
      <td>{{employee.lastName}}</td> 
      <td>{{employee.age}}</td> 
      <td><input type="text" class="datepicker" ng-model="employee.date1" datepicker /></td> 
      <td><input type="text" class="datepicker" ng-model="employee.date2" datepicker/></td> 
     </tr> 
    </tbody> 
</table> 

Nach dieser Tabelle erzeugt wurden, einfach den Code aufrufen unten,

var ele = document.getElementById('demo-table'); 
var blob = new Blob([ele.innerText], { 
     type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8" 
    }); 
    saveAs(blob, "demo-table.csv"); 
}; 

Für andere Konfigurationen, überprüfen Sie das Dokument von FileSaver.js.

Ich hoffe, dies würde Ihr Problem lösen.