Angular 2 - PrimeNG - dataTable一次扩展一行

Question

在PrimeNG中 - 有没有办法只允许一次扩展一行？

<p-dataTable [value]="cars" expandableRows="true">
        <p-column expander="true" styleClass="col-icon"></p-column>
         <p-column field="vin" header="Vin"></p-column>
        <ng-template let-car pTemplate="rowexpansion">
         ...
</p-dataTable>

Answer 1

试着在<p-dataTable [value]="cars" rowExpandMode="single" expandableRows="true">下面使用

添加rowExpandMode =“single”以一次打开一行。

Answer 2

我可以告诉你如何解决它，希望它对你有用。

It is not the actual solution for this issue but you will get Idea how to 
solve this. Also I am using javascript in the code. You can convert it into 
angular way.

<p-dataTable expandableRows="true"
   (onRowExpand) = "onRowExpand($event)">

onRowExpand(data : any) {
        var d = document.getElementsByClassName('fa fa-fw ui-c ui-row-toggler fa-chevron-circle-down');
        if (d.length > 0) {
            for (var i = 0; i < d.length; i++) {
                this.renderer.setElementStyle(d[i].parentElement.parentElement.parentElement.nextElementSibling,'display','none')
            }
        }
}

What i am doing here is fetching the class which is having 
fa-chevron-circle-down'. Then taking parent element recursively till the 
<tr>. Then take the next sibling element and you can delete it or you can do 
display none dynamically.

Answer 3

当我将PrimeNG Grid升级到TurboTable版本时，问题就解决了......这是自PrimeNG 5以来的新功能，而不是使用

Answer 4

PrimeNG 7.1.1：将rowExpandMode属性设置为'single'将起作用。

<p-table #dt [columns]="cols" [value]="tableData" [rows]="pageOptions.perPage" [totalRecords]="totalRecords"[rowsPerPageOptions]="rowsPerPageOptions" [responsive]="true" rowExpandMode="single">