2017-02-08 17 views
0

私はJs-xlsx APIを使ってデータを.xlsxファイルにエクスポートします。私はAngularJsを使ってサンプルコードを書こうとしましたが、達成できませんでした。私はそれを見つけることができませんでした.Js-xlsxを使って.xlsxファイルにデータのリストを書き込む方法を知っている人は誰でも助けてください。ワークブックがjs-xlsxに定義されていません

コードスニペット、

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.8.2/xlsx.core.min.js"></script> 

... 

<button ng-click="ExportData()">Export<button> 

AngularJsコントローラ

$scope.ExportData= function(){ 

var workbook=new Workbook();// throws not defined 
$scope.dataArrayForExportCsv=[ {userName:data.userName, age:data.age} ]; 
workbook = sheet_from_array_of_arrays($scope.dataArrayForExportCsv); 
XLSX.writeFile(workbook, 'sample.xlsx'); 
} 

答えて

0

私はあなたがスタイリングする必要があります.IF次linkを参照それを解決することができました。あなたはと呼ばれる民俗プロジェクトに変えなければならないxlsxファイル。この投稿を書くと、ブランチはxlsx masterにマージされません。したがって、npmを使用して必要なJSファイルをダウンロードする必要があります。

jszip.jsxlsx.min.jsファイルをHTMLファイルにインポートしてコーディングします。Cell objectを使用してセルスタイルを追加できます。

サンプルセルスタイルのコードスニペット

function sheet_from_array_of_arrays(data, opts) { 
     var ws = {}; 
     var range = {s: {c:10000000, r:10000000}, e: {c:0, r:0 }}; 
     for(var R = 0; R != data.length; ++R) { 
      for(var C = 0; C != data[R].length; ++C) { 
       if(range.s.r > R) range.s.r = R; 
       if(range.s.c > C) range.s.c = C; 
       if(range.e.r < R) range.e.r = R; 
       if(range.e.c < C) range.e.c = C; 
       var cell = {}; 

       //Set Header col styles 
       if(R <= 0){ 
        cell = { 
        v: data[R][C], 
        s : { 
          fill : { 
            fgColor : { 
             theme : 8, 
             tint : 0.3999755851924192, 
             rgb : '7DCEA0' 
            } 
              }, 
              font : { 
               color : { 
                rgb : "FFFFFF" 
               }, 
               bold : true, 
               sz : "14" 
              } 
             } 
        }; 
    } else if (data[R][C] == "SUCCESSFUL") { 
      //You can check any conditions on text and add styles you wanted. 
    }else{ 

     //Set other cells styles 
     cell = { 
              v : data[R][C], 
              s : { 
               fill : { 
                fgColor : { 
                 theme : 8, 
                 tint : 0.3999755851924192, 
                 rgb : '08CB26' 
                } 
               }, 
               font : { 
                color : { 
                 rgb : "FFFFFF" 
                }, 
                bold : true 
               }, 
               border : { 
                bottom : { 
                 style : "thin", 
                 color : { 
                  theme : 5, 
                  tint : "-0.3", 
                  rgb: "E8E5E4" 
                 } 
                } 
               } 
              } 
             }; 

     } 

       if(cell.v == null) continue; 
       var cell_ref = XLSX.utils.encode_cell({c:C,r:R}); 

       if(typeof cell.v === 'number') cell.t = 'n'; 
       else if(typeof cell.v === 'boolean') cell.t = 'b'; 
       else if(cell.v instanceof Date) { 
        cell.t = 'n'; cell.z = XLSX.SSF._table[14]; 
        cell.v = datenum(cell.v); 
       } 
       else cell.t = 's'; 

       ws[cell_ref] = cell; 
      } 
     } 

セットCOL幅

     var wscols = [ { 
          wch : 40 
         }, { 
          wch : 40 
         }, { 
          wch : 20 
         }, { 
          wch : 20 
         }, { 
          wch : 40 
         }, { 
          wch : 40 
         }, { 
          wch : 20 
         }, { 
          wch : 20 
         }, { 
          wch : 20 
         }, { 
          wch : 20 
         }, { 
          wch : 20 
         }, { 
          wch : 40 
         }, { 
          wch : 40 
         } ]; 
     ws = sheet_from_array_of_arrays(myRestData); 
     ws['!cols'] = wscols; 
     ... 
関連する問題