Geek Answers Handbook

[Ionic] [Onesignal] How to refresh a page when a notification is pressed

I want my application to automatically update in order to retrieve the latest data from the API whenever the user clicks the notification sent by the pushnotification server from the user. Below is a sample code, I am having problems calling the controller function for dorefresh () from App.js. Or is there another way around the path that allows me to get the latest data?

App.js

angular.module('starter', ['ionic','starter.controllers']) .run(function($ionicPlatform, $rootScope) { $ionicPlatform.ready(function() { // Enable to debug issues. // window.plugins.OneSignal.setLogLevel({logLevel: 4, visualLevel: 4}); var notificationOpenedCallback = function(jsonData) { //alert("Notification received:\n" + JSON.stringify(jsonData)); //console.log('didReceiveRemoteNotificationCallBack: ' + JSON.stringify(jsonData)); $rootScope.openedFromNotification = true; alert($rootScope.openedFromNotification); $ionicHistory.clearCache(); $window.location.reload(true); }; // Update with your OneSignal AppId and googleProjectNumber before running. window.plugins.OneSignal.init("xxxxxxxxxxxxxxxx", {googleProjectNumber: "xxxxxxxxxxxxxx"}, notificationOpenedCallback); }); })

Controller.js

 angular.module('starter.controllers',['ionic']) .controller('MainCtrl', function($scope, $rootScope, $http) { $http.get("localhost/test/getitem.php") .success(function (response) { $scope.items = response; }); $scope.doRefresh = function() { console.log("Refreshing!"); $http.get("localhost/test/getitem.php") .success(function(response) { $scope.items = formatData(response); }) .finally(function() { $scope.$broadcast('scroll.refreshComplete') }) };

Index.html

 <ion-refresher pulling-text="Pull to refresh" on-refresh="doRefresh()"> </ion-refresher> <div class="item"> <h2 style="text-align:center; font-size:25px; font-weight:">{{item.name}}</h2> </div>
+4
source share
1 answer

You can broadcast the event in notificationOpenedCallback :

 var notificationOpenedCallback = function(jsonData) { //alert("Notification received:\n" + JSON.stringify(jsonData)); //console.log('didReceiveRemoteNotificationCallBack: ' + JSON.stringify(jsonData)); $rootScope.openedFromNotification = true; alert($rootScope.openedFromNotification); // $ionicHistory.clearCache(); // $window.location.reload(true); $rootScope.$broadcast('app:notification', {refresh: true}); };

As you can see, I created a custom app:notification event and used $rootScope to broadcast it ( $broadcast ) in the area with children.
I added an object with information that your receiver can use.

Now in your controller you can intercept the event using $scope.$on and call the update function:

 angular.module('starter.controllers',['ionic']) .controller('MainCtrl', function($scope, $rootScope, $http) { $scope.$on('app:notification', function(event, data) { console.log(data); if (data.refresh) { $scope.doRefresh(); } }); });

NOTES:

You do not need to clear the cache here $ionicHistory.clearCache(); .

+3
source

More articles:


All Articles