Блог

Главная - Вопросы по программированию - Как я могу Отобразить столбец кнопок в угловой таблице данных?

Как я могу Отобразить столбец кнопок в угловой таблице данных?

#angular #datatable #datatables #angular-datatables

Вопрос:

Я использую таблицу угловых данных для одного из своих проектов (Angular 11). Я использую разбивку на страницы на стороне сервера для запроса таблицы стран в соответствии с приведенным здесь примером: https://l-lin.github.io/angular-datatables/#/basic/server-side-angular-way

Вот мой код компонента.

 ngOnInit(): void {
    this.dtOptions = {
        pagingType: 'full_numbers',
        pageLength: 10,
        serverSide: true,
        processing: true,
        ajax: (dataTablesParameters: any, callback) => {
            this.commonService.GetCountries(dataTablesParameters).subscribe(resp => {
                this.countries = resp;
                this.cd.detectChanges();
                
                callback({recordsTotal: resp.recordsTotal, recordsFiltered: resp.recordsFiltered, data: resp.data });
            });
        },
        columns: [{ data: 'Id' }, { data: 'Country' }]
    };
}

Это моя HTML-страница

 <table datatable [dtOptions]="dtOptions" class="table row-border hover table-striped table-hover" style="width: 100%;">
    <thead>
        <tr>
            <th>#</th>
            <th>Country</th>
            <th>Action</th>
        </tr>
    </thead>
    
    <tbody *ngIf="countries?.data?.length != 0">
        <tr *ngFor="let country of countries?.data; let i = index;">
            <td>{{ i   1 }}</td>
            <td>{{ country.Country }}</td>
            <td><button (click)="editCountry(country?.Id)">Edit</button></td>
        </tr>
    </tbody>
</table>

Таблица данных работает отлично, но я не получаю последнее действие столбца в таблице данных. Поскольку я новичок в angular, я что-нибудь пропустил здесь?

Метки: