Экспорт данных в Excel в Angular: подробное руководство

Экспорт данных в Excel — обычное требование во многих приложениях Angular. В этой статье блога мы рассмотрим различные методы выполнения этой задачи на примерах кода. Если вам нужно экспортировать таблицу, список или любую другую структуру данных, мы вам поможем. Давайте погрузимся!

Метод 1: использование библиотеки ExcelJS
ExcelJS — это популярная библиотека JavaScript, которая позволяет создавать файлы Excel и управлять ими. Вот пример экспорта данных в Excel с использованием ExcelJS в Angular:

import * as ExcelJS from 'exceljs/dist/exceljs.min.js';
exportToExcel(data: any[]): void {
  const workbook = new ExcelJS.Workbook();
  const worksheet = workbook.addWorksheet('Sheet 1');
  // Populate the worksheet with data
  data.forEach((item, index) => {
    worksheet.getCell(`A${index + 1}`).value = item.property1;
    worksheet.getCell(`B${index + 1}`).value = item.property2;
    // Add more cells for additional properties
  });
  // Save the workbook
  workbook.xlsx.writeBuffer().then((buffer: ArrayBuffer) => {
    const blob = new Blob([buffer], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
    saveAs(blob, 'data.xlsx');
  });
}

Метод 2: использование библиотеки XLSX
Если вы предпочитаете другую библиотеку, вы можете использовать библиотеку XLSX, которая предоставляет аналогичные функции. Вот пример экспорта данных в Excel с использованием XLSX в Angular:

import * as XLSX from 'xlsx';
exportToExcel(data: any[]): void {
  const workbook = XLSX.utils.book_new();
  const worksheet = XLSX.utils.json_to_sheet(data);
  // Add the worksheet to the workbook
  XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet 1');
  // Save the workbook
  const excelBuffer = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });
  const blob = new Blob([excelBuffer], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
  saveAs(blob, 'data.xlsx');
}

Метод 3. Использование серверного API.
Другой подход заключается в отправке данных в серверный API, который генерирует файл Excel и возвращает его в виде загрузки. Вот пример того, как этого можно добиться в Angular:

import { HttpClient } from '@angular/common/http';
exportToExcel(data: any[]): void {
  this.http.post('https://your-api.com/export-to-excel', data, { responseType: 'blob' }).subscribe((blob: Blob) => {
    saveAs(blob, 'data.xlsx');
  });
}

В этой статье мы рассмотрели различные методы экспорта данных в Excel в Angular. Мы рассмотрели использование таких библиотек, как ExcelJS и XLSX, а также использование серверного API. В зависимости от ваших конкретных требований и предпочтений вы можете выбрать метод, который соответствует вашим потребностям. Экспорт данных в Excel повышает удобство использования и гибкость ваших приложений Angular, позволяя пользователям работать с данными вне среды приложения.