<div style="height: 600px">
<eui-table-v2 #euiDataTable isVirtualScroll isAsync [virtualScrollAsyncItemsLength]="duplicatedData.length" [data]="data" (scrollChange)="onScrollChange($event)">
<ng-template euiTemplate="header">
<tr>
<th>Id</th>
<th>Country</th>
<th>Year</th>
<th>ISO</th>
<th>Population</th>
<th>Capital</th>
</tr>
</ng-template>
<ng-template let-row euiTemplate="body">
<tr>
<td>{{ row.id }}</td>
<td nowrap><span class="eui-flag-icon eui-flag-icon-{{ row.iso.toLowerCase() }} eui-u-mr-s"></span>{{ row.country }}</td>
<td>{{ row.year }}</td>
<td>{{ row.iso }}</td>
<td>{{ row.population | number }}</td>
<td>{{ row.capital }}</td>
</tr>
</ng-template>
<ng-template let-row euiTemplate="footer">
<tr>
<td></td>
<td></td>
<td colspan="6">Footer</td>
</tr>
</ng-template>
</eui-table-v2>
</div>
|