I have a chat message display that displays the oldest messages at the top and the most recent messages towards the bottom. I'm using an `ng-repeat` on a `$scope.messages` array, and new chat messages are dynamically added to that array. The `ng-repeat` has an `orderBy` filter component to help sort the messages by date created. 

I'm trying to use `ng-if` to hide certain aspects of the HTML (the user's avatar, name, msg-timestamp, etc.) when a message is sent by the same user on the same day. *However, my logic gets screwed up when a new message is added* to the `$scope.messages` array.

Shortened version of HTML:

```
<div class="ListMessage" ng-repeat="message in messages | orderBy: 'created' track by message.xpid">
  <div class="Avatar" ng-if="headerDisplay(message)">
  </div>
  <div class="TimeStamp" ng-if="headerDisplay(message)">
  </div>
  <div class="MessageContent">
  </div>
</div>

```

And here's the applicable chat controller:

```
$scope.messages = [];

// use an HTTP service to retrieve messages...
$scope.$on('messages_updated', function(event, data){
  $scope.messages = data;
};

$scope.headerDisplay = function(message){
  var idx = $scope.messages.indexOf(message);
  var curMsg = $scope.messages[idx];
  var nextMsg;

  // if last msg in array (this is actually the 1st msg sent cuz of the orderBy) --> display avatar
  if (idx === $scope.messages.length-1){
    return true;
  }

  // if not the last msg in array (not the 1st sent)...
  if (idx !== $scope.messages.length-1){
    nextMsg = $scope.messages[idx+1];
    var nextMsgDate = new Date(nextMsg.created);
    var curMsgDate = new Date(curMsg.created);
    // if msg is on a new day --> display avatar
    if (curMsgDate.getDate() !== nextMsgDate.getDate()){
      return true;
    } else if (curMsg.fullProfile.displayName !== nextMsg.fullProfile.displayName){
      // if msg is from diff user --> display avatar
      return true;
    } else {
      return false;
    }
  }
};

```

This code works upon first glance. Initially, because of the `orderBy` filter, the message at the last index of `$scope.messages` is actually the first message and the message at the *0* index is the last message added. 

But whenever a new message is added, Angular dynamically updates the scope, and for a split second before the `orderBy` filter is applied, that *new message is at the last index of `$scope.messages`.* This throws off the logic behind my `ng-if` method so that every new message from the same user is showing up with the HTML elements I want hidden (i.e. it's returning *true* on the `ng-if` method). 

According to extensive `console.logging` on my part, at the time of compiling the HTML for the `ng-if`, the message at the *0* index remains the second to the last message sent (not the most recent), and the newest, most recent message actually is the item in the last index of the array. This results in that first `if` statement taking effect and the HTML elements being displayed for every new message sent by the same user on the same day (unless I do a page refresh, wherein everything displays properly).

Any workarounds anyone can think of?