На самом деле у меня в таблице 12 столбцов, но только 4 напечатанных столбца.Кроме того, моя функция печати работает, только если мой браузер обновлен, иначе это невозможно. Когда я попытался напечатать таблицу в следующий раз без обновления браузера, тогда функция печати не работала.Ниже я упомянул код ...
это моя функция печати в файле component.ts
print(id) {
console.log(id);
if(document.getElementById(id) != null){
var printContents = document.getElementById(id).innerHTML;
var originalContents = document.body.innerHTML;
document.body.innerHTML = printContents;
window.print();
document.body.innerHTML = originalContents;
}
window.close();
}
и в моем компоненте .html
<div class="table-responsive" id ="dataTable" *ngIf="studentreport">
<table class ="table" >
<h3 class = "text-center panel-heading bg-primary"> Student Report</h3>
<br>
<ngx-datatable class="material expandable" [rows]="rows" expanded="expanded" [sortType]="'multi'" [columnMode]="'force'" [headerHeight]="50"
[footerHeight]="50" [rowHeight]="'auto'">
<ngx-datatable-column name="ID" prop="id">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template>{{value}}</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Adm No" prop="admission_no">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Name" prop="name">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Course" prop="course">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Batch" prop="batch">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Contact No" prop="phone.number" *ngIf ="!phonenumber">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Class" prop="class">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="permanent Address" prop="address_detail.address" *ngIf = "!address">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Temporary Address" prop="temporary_address" *ngIf="!address">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Gurdian Name" prop="guardian_details.name" *ngIf="!gurdiandetail">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Gurdian Address" prop="guardian_details.address.address" *ngIf="!gurdiandetail">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Gurdian Contact" prop="guardian_details.contact.number" *ngIf="!gurdiandetail">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Father Name" prop="parent_details.father.name" *ngIf="!parentsdetail">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Mother Name" prop="parent_details.mother.name" *ngIf="!parentsdetail">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Father Contact" prop="parent_details.father.mobile" *ngIf="!parentsdetail">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Mother Contact" prop="parent_details.mother.mobile" *ngIf="!parentsdetail">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Amount" prop="amount" *ngIf="!amount">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Email" prop="email"*ngIf="!email">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template>{{value}}</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Admission Date" prop="admission_date">
<ng-template let-column="column" ngx-datatable-header-template>{{column.name}}</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template let-rowIndex="rowIndex" let-row="row">{{value}}
</ng-template>
</ngx-datatable-column>
</ngx-datatable>
</table>
</div>
guideя с вашим ответом, который печатает все столбцы таблицы, а также, если я напечатал уже один раз, если я хочу печатать в следующий раз без обновления браузера.