datatable.component.html

<p>
    <button (click)="click()">click</button>
</p>

<accordion>
    <accordion-group #ag [panelClass]="'custom-accordion'" class="my-2">
        <button class="btn btn-link btn-block clearfix" accordion-heading>
            <div class="pull-left float-left">
                Datatable
                &nbsp;
                <span *ngIf="ag.isOpen"><i class="fas fa-chevron-up"></i></span>
                <span *ngIf="!ag.isOpen"><i class="fas fa-chevron-down"></i></span>
            </div>
        </button>
        <div *ngIf="searchMeta">
            <div class="table-responsive-sm">
                <table class="table table-striped">
                    <thead>
                        <tr>
                            <th *ngFor="let attribute of searchMeta.attributes_selected" scope="col">{{ attribute.label }}</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr *ngFor="let datum of searchData">
                            <td *ngFor="let attribute of searchMeta.attributes_selected" [innerHTML]="datum[attribute.name]"></td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <pagination [totalItems]="searchMeta.total_items" (pageChanged)="getSearchData.emit($event.page)"></pagination>
        </div>
    </accordion-group>
</accordion>