BoldSignEasily embed eSignatures in your .NET applications. Free sandbox with native SDK available.
<div class="control-section">
<ejs-grid #grid [dataSource]='data' id='Grid'>
<ng-template #detailTemplate let-data>
<table class="detailtable" width="100%">
...
<tbody>
<tr>
<td rowspan="4" style="text-align: center;">
<img class='photo' src="./assets/grid/images/{{data.EmployeeID}}.png" alt="{{data.EmployeeID}}" />
</td>
<td>
<span style="font-weight: 500;">First Name: </span> {{data.FirstName}}
</td>
<td>
<span style="font-weight: 500;">Postal Code: </span> {{data.PostalCode}}
</td>
</tr>
...
</tbody>
</table>
</ng-template>
<e-columns>
<e-column headerText='Expand/collapse' width='150' textAlign='Center'>
<ng-template #template let-data>
<button (click)="clicked($event)">Click</button>
</ng-template>
</e-column>
...
</e-columns>
</ejs-grid>
</div> |
...
export class AppComponent {
...
ngOnInit(): void {
...
}
clicked(e) {
let tr = parentsUntil(e.target, 'e-row');
let trIdx = parseInt(tr.getAttribute('aria-rowindex'));
if (parentsUntil(e.target, 'e-row').children[0].classList.contains('e-detailrowexpand')) {
this.grid.detailRowModule.collapse(trIdx)
} else {
this.grid.detailRowModule.expand(trIdx)
}
}
} |