ng-if causing problems for rowsRendered

I've written a directive for the grid that indicates hovering a row by adding a class to that row. Something like (snippet):

pre: function($scope, $elm, $attrs, uiGridCtrl) {
            uiGridCtrl.grid.api.core.on.rowsRendered($scope, function() {
              $elm.find('.ui-grid-row')
                .unbind('mouseenter mouseleave')
                .bind('mouseenter', function(e) {
                  jQuery(this).addClass('grid-row-hover-active');
                })
                .bind('mouseleave', function(e) {
                  jQuery(this).removeClass('grid-row-hover-active');
                })
            });
          }

First time the grid is rendered, it works fine. For some reason, the event is called twice, it originates in Grid.setVisibleRows() in the line: self.api.core.raise.rowsRendered(this.api); At both times I break at this line and view this.api.grid.id.

First render the grid IDs are the same, so the event listener in the directive is called twice, once before there are any rows rendered (meaning $elm.find('.ui-grid-row') = []), and once after the rows are really rendered, and then the mouse events are attached well.

The problem is after I hide the grid with ng-if variable, and then I show it again to re-render it with different grid options (since there's no way to change grid options at run time), the event is called twice, but the grid object has different ID's at both calls (unlike the first time I render it). So the directive listener is called only once before there are any rows rendered and for the second 'raise' it's the previous grid ID (the one before I hid and showed it), so the event listener is not called, and the hover-class is not added to the rows.

Right now I solved this by altering the rowTemplate, but my directive is a general solution and I would like to know why this error exists, or why the rowsRendered event is called twice, once before the rows are even rendered.