Выберите столбцы для экспорта в материале Angular
У меня есть проект в материалах Angular, в котором я использую
matTableExporter
модуль.
Я хочу экспортировать данные из таблицы в файл xlsx. В таблице 3 столбца: ID, Имя и действия (отвечает за редактирование или удаление).
Я хочу экспортировать только столбцы идентификатора и имени, но когда я экспортирую таблицу, она показывает мне все столбцы, как я могу выбрать, какие столбцы экспортировать?
Это мое
component.html
:
<div class="title">Customers</div>
<mat-divider></mat-divider>
<div fxLayout="column" fxLayoutGap="10px" class="m-3">
<mat-card class="mat-elevation-z8">
<div>
<button mat-raised-button
(click)="exporter.exportTable('xlsx')">Export excel
</button>
</div>
<mat-table matTableExporter [dataSource]="clients" #exporter="matTableExporter">
<ng-container matColumnDef="id">
<mat-header-cell *matHeaderCellDef>ID</mat-header-cell>
<mat-cell *matCellDef="let clients"> {{clients.id}} </mat-cell>
</ng-container>
<ng-container matColumnDef="name">
<mat-header-cell *matHeaderCellDef>Name</mat-header-cell>
<mat-cell *matCellDef="let clients; let i = index">
<mat-form-field floatLabel="never" [appearance]="editIndex != i ? 'none' : 'legacy'">
<input matInput placeholder="{{clients.name}}" [(ngModel)]="clients.name" [readonly]="editIndex!=i">
</mat-form-field>
</mat-cell>
</ng-container>
</ng-container>
<ng-container matColumnDef="act">
<mat-header-cell *matHeaderCellDef> Actions </mat-header-cell>
<mat-cell *matCellDef="let element
<button mat-icon-button matTooltip="Edit" (click)="edit(element)">
<mat-icon class="icon_edit_button">edit</mat-icon>
</button>
<button *ngIf="editIndex != i" mat-icon-button matTooltip="Delete" (click)="delete(element)">
<mat-icon>delete_forever</mat-icon>
</button>
</mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let col; columns: displayedColumns;"></mat-row>
</mat-table>
<mat-paginator [pageSizeOptions]="[5, 10, 20]" showFirstLastButtons></mat-paginator>
</mat-card>
</div>
1 ответ
https://www.npmjs.com/package/mat-table-exporter
Вы должны использовать Input () hiddenColumns
(Необязательно) Индексы столбцов, которые не нужны в выходном файле
<mat-table matTableExporter [hiddenColumns]="[2]" [dataSource]="clients" #exporter="matTableExporter">