data-hide is not working when it is used with ng-repeat in <th> element

[Moxy1683]

When i use data-hide along with ng-repeat in element as below, it is not hiding the columns for mobile and tablet screen size.
<th data-toggle="true"></th>
<th data-hide="phone, tablet" ng-repeat="period in vm.periods | limitTo : 8 : 0">{{period}}</th>
<th ng-repeat="lastperiod in vm.periods | limitTo : 1 : 8">{{lastperiod}}</th>
My intention is here to fetch the column names from REST service and use it along with data-hide for few of them. However i noticed that all columns are appearing irrespective of the screen size.