Excel 서비스로 Web Components 그리드 내보내기
웹 구성 요소 그리드의 Excel 서비스로 Web Components 요소 내보내기를 Ignite UI for Web Components 데이터를 Excel로 내보낼 수 있습니다. 데이터 내보내기 기능은 ExcelExporterService
클래스에 캡슐화되어 있으며 데이터는 MS Excel 테이블 형식으로 내보내집니다. 이 형식을 사용하면 필터링, 정렬 등과 같은 기능을 사용할 수 있습니다. 이렇게 하려면 ExcelExporterService
의 Export
메서드를 호출하고 IgcGridComponent
구성 요소를 첫 번째 인수로 전달하여 그리드를 쉽게 내보내야 합니다.
Web Components Excel Exporter Example
Export Grouped Data
그룹화된 데이터를 내보내려면 IgcGridComponent
를 하나 이상의 열로 그룹화하면 됩니다. 브라우저는 선택한 열별로 그룹화된 MS Excel 형식의 IgcGridComponent
구성 요소의 데이터를 포함하는 "ExportedDataFile.xlsx"라는 파일을 다운로드합니다. 주제의 시작 부분에서 예를 찾을 수 있습니다.
Export Multi Column Headers Grid
이제 수출이 가능해졌습니다 IgcGridComponent
정의된 다중 열 헤더. 모든 헤더는 내보낸 Excel 파일에 표시되는 대로 반영됩니다. IgcGridComponent
. 내보낸 데이터에서 정의된 다중 열 헤더를 제외하려는 경우 다음을 설정할 수 있습니다. ExporterOption
IgnoreMultiColumnHeaders
에게 true
.
[!Note] The exported
IgcGridComponent
will not be formatted as a table, since Excel tables do not support multiple column headers.
Export Grid with Frozen Column Headers
기본적으로 Excel 내보내기 서비스는 스크롤 가능한(고정 해제된) 열 머리글과 함께 그리드를 내보냅니다. 사용자가 레코드를 스크롤할 때 항상 표시되도록 내보낸 Excel 파일 위에 모든 헤더를 고정하려는 시나리오가 있습니다. 이를 달성하려면 ExporterOption
FreezeHeaders
true
로 설정할 수 있습니다.
constructor() {
var gridToolbarExporter1 = document.getElementById('gridToolbarExporter1') as IgcGridToolbarExporterComponent;
gridToolbarExporter1.addEventListener("exportStarted", this.webGridExportEventFreezeHeaders);
}
public webGridExportEventFreezeHeaders(args: any): void {
args.detail.options.freezeHeaders = true;
}
Known Limitations
한정 | 설명 |
---|---|
최대 워크시트 크기 | Excel에서 지원되는 최대 워크시트 크기는 1,048,576행 x 16,384열입니다. |
셀 스타일링 | Excel 내보내기 서비스는 셀 구성 요소에 적용된 사용자 정의 스타일 내보내기를 지원하지 않습니다. 이러한 시나리오에서는 Excel 라이브러리를 사용하는 것이 좋습니다. |
API References
ExcelExporterService
ExcelExporterOptions
IgcGridComponent
Additional Resources
우리 커뮤니티는 활동적이며 항상 새로운 아이디어를 환영합니다.