I'm submitting a ... (check one with "x")
[X] bug report => Search github for a similar issue or PR before submitting
[ ] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35
Current behavior
When I try to add sorting to my table sorting does not seem to work
Minimal reproduction of the problem with instructions
<ng-template pTemplate="caption">
<i class="fa fa-search" style="margin:4px 4px 0 0"></i>
<input type="text" pInputText size="50" placeholder="Global Filter" (input)="dt.filterGlobal($event.target.value, 'contains')"
style="width:auto">
</ng-template>
<ng-template pTemplate="header">
<tr>
<th [pSortableColumn]="Name">Client</th>
<th [pSortableColumn]="Amount">Amount</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-item>
<tr>
<td>{{item.Name}}</td>
<td>{{item.Amount | numberOverride:'1.2-2':'-'}}</td>
</tr>
</ng-template>
<ng-template pTemplate="footer" let-item>
<tr>
<td>Totals</td>
<td>{{totalsService.Amount}}</td>
</tr>
</ng-template>
Try surrounding the value of pSortableColumn with an extra set of single quotes like below.
<th [pSortableColumn]="'Name'">Client</th>
<th [pSortableColumn]="'Amount'">Amount</th>
@bias-keenly Thanks
@bias-keenly, Thanks, it worked! But, may we know the reason why?!
@KrishnaPuppala, that's a natural Angular behavior. When you use a property surrounded by square brackets it expects a variable, not value. By using quotes it makes it string value.
You can also just use the attribute without the brackets like so:
<th pSortableColumn="Name">Client</th>
Most helpful comment
Try surrounding the value of pSortableColumn with an extra set of single quotes like below.