Reload iion nic replay list when new item is received in angularJS service

Question

I have this html (snippet to see ng-repeat ):

  <ion-list show-delete="data.showDelete" id="deleteme"> <div class="list list-inset searchlist" > <label for="searchText" class="item item-input searchlabel" > <i class="icon ion-search placeholder-icon"></i> <input type='text' ng-model='searchText' placeholder="Search"/> </label> </div> <ion-item class="item-icon-left item-icon-right" ng-repeat="message in messageList | orderBy:'date':true | filter:searchText track by $id($index)" ng-click="openMessage(message.id)" > <i class="icon ion-record" style="color:#8EBF3F;font-size:15px;height:70%" ng-show='message.mesgRead == false'></i> <i class="" ng-show='message.mesgRead == true'></i> <h2 class="messagecontent" >{{message.mesgContent}} </h2> <p class="messagedate">{{message.displayDate}} </p> <i class="icon ion-chevron-right icon-accessory"></i> <ion-option-button class="button-assertive" style="line-height:73px;" ng-click="deleteMessage(message)"> Delete </ion-option-button> </ion-item> </ion-list> 

This is the controller (code snippet):

  .controller('MessagesCtrl', function($scope, MessagesService, $timeout, ProfileService, $window, $filter, $sce, $ionicLoading, $ionicPopup) { $scope.messageList = ""; console.log("check for messages..."); MessagesService.loadFromMessageDB().then(function (dbMessages) { $scope.messageList = dbMessages; }); 

So this works well and my ng-repeat full.

I use PushPlugin, so when I get Push Notification, this callback, which is inside my MessagesService , starts:

  onNotificationResponse: function(sender, message, msgId, msgType, msgUrl) { console.log("myApp.onNotificationResponse:" + message + " msgUrl:" + msgUrl); var nowDate = new Date().getTime(); nowDate = moment(nowDate).format("ddd, Do MMM, H:mm"); var jsDate = new Date(); var tmpMessage = new myApp.Message(msgId, nowDate, msgType, sender, jsDate, message, msgUrl, false); messages.unshift(tmpMessage); messageDB.save(tmpMessage); }, 

My problem: I don't know how to update the ng-repeat list. I tried adding $rootScope.$apply(); to the onNotificationResponse function, but did nothing.

So how do I add this new message to the ng-repeat list?

UPDATE:

Adding this to the onNotificationResponse function:

  $rootScope.$broadcast('newMessage', messages); 

And then this is to the controller:

  $scope.$on('newMessage', function(event, messages) { console.log("WOW, a new message!!! "); $scope.messageList = messages; $scope.$apply(); }); 

It works! However - this adds my new message to the end of the ng-repeat list. How can I add a message to the beginning?

Answer 1

I ended up having to change this part:

  var jsDate = new Date(); 

:

  var jsDate = new Date().getTime(); 

According to one of the angularJS guys, getTime () returns a number that works better when using orderBy / sorting.

Hope this helps someone else in the future!