I'm displaying a primeng table and the cell format will depend on the next column value, i.e. the one beside it to the right.
I'm wondering how I can get the value of another column. I have:
<p-column *ngFor="let col of cols" [field]="col.field" [header]="col.header">
<ng-template let-row="rowData" pTemplate="body" *ngIf="col.field!='Name'">
{{row[col.field]}} --displays current cell. I want to compare value to value of cell beside it
</ng-template>
</p-column>
if "row[col.field]" gives me the value of the current column cell value, how can I get cell beside it?
Any ideas?
If you know the column name (eg id) of another column, then {{row['id']}}.
Or if you know the order in which other columns appear (eg 0), then {{row[cols[0].field]}}.
<p-column *ngFor="let col of cols" [field]="col.field [header]="col.header">
<ng-template let-row="rowData" pTemplate="body" *ngIf="col.field!='Name'">
{{row[col.field]}} --displays current cell.
{{row['id']}} --displays cell which column name is 'id'.
{{row[cols[0].field]}} --displays first column cell.
</ng-template>
</p-column>
Related
my question is that is there a way so that I can get element reference of a particular row in mat-table. I am getting the data from an API. I want to display popover over a row in mat-table and popover requires element reference or HTML element to get attached to. Is there a way to do this?
In mat-table, when you use row as:
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
Here, row is the ElementRef, you can pass row in click or hover event, however you want.
I creating a table with sortable column. This is my code:
<p-dataTable [value]="list">
<p-column field="name" header="name" sortable="true">
</p-column>
<p-column field="value" header="value" sortable="true">
</p-column>
</p-dataTable>
The problem is that the sortable indicators are overlapped in the first column, so on click it works on second column only.
With many other column it works in the same way. It seems like all the indicators are overlapped in the same place (see picture).
Any suggestions?
Thanks
I use the selectionMode = "multiple" option of datatable, How mark selected item from the database
Template:
<p-dataTable [value]="userLanguage" dataKey="key">
<p-column [style]="{'width':'38px'}" selectionMode="multiple"></p-column>
<p-column field="languageName" header="Idioma"></p-column>
<p-column field="languageId" header="Código"></p-column>
</p-dataTable>
selectionMode="multiple" needs to go into your p-dataTable line, not on the column. Also, you need to define what model you want to store your selected items, such as [(selection)]="selectedLanguages" on the same line. To display certain items as selected, you need to add the languages to the selectedLanguages array
I am using NG-grid to display data in a table. I need to hide certain cells in a row if the 2nd cell in that same row gives back a certain response. I am writing a method that for each cell it will check to see what the value of the 2nd cell in this row is. My problem is I have no idea how to reference the value in that 2nd cell. Is it something like {{row.entity[col.field[1]]}}??? Thanks you
If you have access to the column name, you can use {{row.getProperty(\'columnName\')}}.
You can look at the row templates for an example.
When the grid is initially rendered, it follows the ordering of the list (model) behind it. How would one revert to that same natural ordering after a sort by column has occurred?
Within an ng-repeater you could set a custom data attribute to {{$index}}
<li class="sortable" ng-repeat="item in items" data-index="{{$index}}">
Then when the DOM is manipulated to produce your column sort the index when rendered will be preserved within data-index