I am currently developing the user interface of a web application using angular6. I have a p-dataTable component (primeNG) with several rows, each row has as a first column a checkbox and as last one a disabled button by default.
The goal is opening a dialog if I select a row by clicking it's checkbox and then clicking it's dialog trigger button after unable that button (and just that one, not the rest of row buttons).
I thought I could get the row selected index and style the button via CSS with nth-child(index) but I read p-columns in a p-datatable doesn't create an index.
It looks like something trivial, but I'm not able to unable just the button of the selected row.
I'll appreciate your help.
That's a simplified markup example:
<p-datatable [value]="data" scrollable="true" scrollHeight="350px [(selection)]="selectedItems" columnResizeMode="expand">
<p-header>
<div class="ui-helper-clearfix">Example Table</div>
</p-header>
<p-column class="checkbox" selectionMode="multiple"></p-column>
<p-column class="data-column" field="dataColumn1" header="Column1"></p-column>
<p-column class="data-column" field="dataColumn2"header="Column2"></p-column>
<p-column>
<ng-template>
<button type="button" class="btn" icon="fa fa-user" [disabled]="??????"></button>
</ng-template>
</p-column>
</p-datatable>
Thanks in advance and greetings!