Sort doesn't work if ng-repeat is used for populating the header <th>

[shirishc]

The sorting by clicking the header and toggle-arrow-tiny works nicely normally but doesn't work well when I use ng-repeat like this shown below. I still get the headers with correct text but no sorting or the toggle icons on the headers.

<th ng-repeat="curr_header in headers">{{curr_header}}</th>

Can you please help ?

[jquinter]

+1. It just doesn't work. Personally I tried with ng-attr in order to specify parameters for footable, and it doesn't work neither.

[Sumedha-Scry]

I have a similar issue. I use ng-repeat for th and it screws up the footable-redraw, when i hard code the headers it works...

[Sumedha-Scry]

My issue is solved - used load-when

[Moxy1683]

@Sumedha-Scry: Can you explain how to use load-when in with a value bound to angular scope? Does it work along with data-hide attribute?

[Sumedha-Scry]

@Moxy1683 e.g to use load-when:
assume two scope variables :
data : has some rows in json format. for eg: [{'id':1,'name':'test'}]
headers : contains keys from data. continuing above eg. ['id','name']

<div  ng-if="data.length">
<table class="footable" load-when="data">
    <thead>
         <tr>
             <th ng-repeat="header in headers">{{header}}</th>
         </tr>
    </thead>
    <tbody>
         <tr  ng-repeat="row in data">
             <td ng-repeat="h in headers">{{row[h]}}</td>
         </tr>
    </tbody>
</table>
</div>

To answer your second question, I have not tried it but theoretically it should work. Hope this helps.

[abmeman]

It's not working bro same issue occured if any one get solution plz post it