Angular template not updating after object manipulation

Question

I have an object as follows:

$scope.allSessions = {
    set: {},
    pending: []
};

A method then later fills the set property with a bunch of objects like the below

"2014-06-07-11-30": {
    blah blah
}

This generates a nice list of dates (like the top bit in this image):

I have written a method so that when the X is pressed via an ng-click, the date is removed from the list, and moved into the pending "x session(s) not scheduled" part. The method removes the entry from the set property and creates an entry the pending array. Here is the method and the template for that:

$scope.makeSessionPending = function(session) {
    // Create an entry in pending (only length is required)
    $scope.allSessions.pending.push({
        length: session.length
    });

    // Remove from set sessions
    delete $scope.allSessions.set[session.index];
};

<ul class="sessions">
    <li ng-repeat="session in allSessions.set">
        [[ session.dateString ]]
        <span class="status" ng-class="session.status" ng-if="statusReceived"></span>
        <span class="make-pending" ng-click="makeSessionPending(session)"><i class="icon icon-times"></i></span>
        <span class="remove" ng-click="removeSession(session)"><i class="icon icon-trash-o"></i></span>
    </li>
    <li class="pending" ng-if="allSessions.pending.length">
        <i class="icon icon-ellipsis-h"></i>
        [[ allSessions.pending.length ]] session[[ (allSessions.pending.length == 1) ? '' : 's' ]] not scheduled
    </li>
</ul>

My issue is that after the first time a session is made pending the [[ allSessions.pending.length ]] is no longer updated. However if I console log at the end of the makeSessionPending method it all appear correct, its just the template not reflecting the change in length of the pending array.

Another couple of strange things to note, is that if I inspect that line in the html, it is correct. And when I highlight the line, it updates!?

Answer 1

The issue actually turned out to be a CSS problem, where as soon as I put position: relative on the element containing the problem line, it would no longer update.

I ended up having to take the position: relative off and work around it