$index always 0 when using ng-bind-html

Question

I have a directive that contains this markup

<tr ng-if="isComplete()" ng-repeat="row in paged.page() track by $index" ng-click="rowClick(row, $event)" ng-class="assignRowClass(row)">
    <td ng-repeat="header in headers" ng-bind-html="trustAsHtml(header.formatter(row[header.property], row, $index))"></td>
</tr>

The problem is that $index is always 0 when passed to the header.formatter function.

Answer 1

try this

<tr ng-if="isComplete()" ng-repeat="(index,val) in paged.page() track by index" ng-click="rowClick(val, $event)" ng-class="assignRowClass(val)">
<td ng-repeat="header in headers" ng-bind-html="trustAsHtml(header.formatter(val[header.property], val, index))"></td>

Answer 2

正如我在评论中所看到的那样

onCreate()

这是因为$parent.$index 创建的新范围以及范围之间的角度继承限制（因为javascript限制）。

如果可能（ng-if / $parent.$index），您可以转到<thead>将ng-if移动到上层DOM元素。