Reputation: 580
DataTableRowExpander does not work when a column has a template attached to it. Please see below code for reference.
<p-dataTable [value]="projects" expandableRows="true">
<p-column expander="true" style="width:22px"></p-column>
<p-column field="projectState" [sortable]="true" header="Status"></p-column>
<p-column field="bid" header="BU" [sortable]="true">
<template #col #project="rowData" class="col-md-1">
{{GetBU(project[col.field])}}
</template>
</p-column>
<template #project >
<div class="ui-grid ui-grid-responsive ui-fluid" style="font-size:16px;padding:20px">
<div class="ui-grid-row">
<div class="ui-grid-col-9">
<div class="ui-grid ui-grid-responsive ui-grid-pad">
<div class="ui-grid-row">
<div class="ui-grid-col-2 label">Vin: </div>
<div class="ui-grid-col-10">{{project.projectState}}</div>
</div>
</div>
</div>
</div>
</div>
</template>
</p-dataTable>
Upvotes: 3
Views: 3098
Reputation: 869
For anyone still experiencing this issue I was able to fix it by placing my row template before the column definitions:
<p-dataTable>
<template let-item>
<!-- ... -->
</template>
<p-column></p-column>
<p-column>
<template>
<!-- ... -->
</template>
</p-column>
<!-- ... -->
</p-dataTable>
Upvotes: 4