Как экспортировать файл Excel из JSON с форматированием и автоматической подгонкой с помощью FileSaver.js

#angular #typescript #filesaver.js

#angular #typescript #filesaver.js

Вопрос:

Я уже могу экспортировать свои данные JSON в Excel с помощью этих функций:

   public exportAsExcelFile(json: any[], excelFileName: string) :Promise<Object> {

    const worksheet: XLSX.WorkSheet = XLSX.utils.json_to_sheet(json);
    const workbook: XLSX.WorkBook = { Sheets: { 'data': worksheet }, SheetNames: ['data'] };
    const excelBuffer: any = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });
    return (this.saveAsExcelFile(excelBuffer, excelFileName));

  }

  private saveAsExcelFile(buffer: any, fileName: string):Promise<Object>  {
    const data: Blob = new Blob([buffer], {type: EXCEL_TYPE});
    return await FileSaver.saveAs(data, fileName   '-'   new  Date().toString()  EXCEL_EXTENSION);
 }
  

Но я не могу понять, как отформатировать этот файл, поэтому я могу, по крайней мере, выделить заголовок жирным шрифтом и ячейки с автоматической подгонкой.

Ответ №1:

Если вы используете js-xlsx, вы не сможете добиться этого без перехода на версию PRO, которая довольно дорогая.

Это версия для сообщества. Мы также предлагаем версию Pro с улучшенной производительностью, дополнительными функциями, такими как оформление, и специальной поддержкой.

Вы можете использовать библиотеку ExcelJS. Он предоставляет функцию без стилизации

  const workbook = new ExcelJS.Workbook();
 workbook.creator = 'Your company name';
 workbook.created = new Date();

 const worksheet = workbook.addWorksheet('Worksheet 1');
  

затем вы можете указать ширину столбцов:

  worksheet.columns = [
     { width: 15 },
     { width: 30 },
     { width: 10 }
 ];
  

вы можете выделить заголовок жирным шрифтом, используя следующий код:

 worksheet.getRow(1).font = { bold: true };
  

укажите стили ячеек:

 worksheet.getCell('A1').border = {
                    top: ...,
                    left: ...,
                    bottom: ...,
                    right: ...
                };
worksheet.getCell('A1').font = ...;
  

и, наконец, экспортировать файл

 import {saveAs} from 'file-saver';
const EXCEL_TYPE = 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8';

...
workbook.xlsx.writeBuffer()
             .then((file: any) => {
                const blob = new Blob([file], { type: EXCEL_TYPE });
                saveAs(blob, `fileName.xlsx`);
             });
  

Перейдите по этой ссылке, чтобы найти дополнительные варианты оформления.