Ionic push notification using FCM

ionic-v1
1

How to read notification when application is open? I have used ‘cloud:push:notification’ but this is not fired.

3

You can do this:

app.run(function ($rootScope, $http, $ionicPlatform {
    $ionicPlatform.ready(function () {
        if (window.cordova) {
            var push = PushNotification.init({
                android: {
                    senderID: "YOUR_FCM_ID",
                    "icon": "phonegap",
                    "iconColor": "blue"
                },
                ios: {
                    alert: "true",
                    badge: "true",
                    sound: "true"
                },
                windows: {}
            });

            push.on('registration', function (data) {
                console.log(data.registrationId);
            });

            push.on('notification', function (data) {
                // Here your code to receive notification when app is opened
                // Use Cordova toast instead of console.log() to show message on a physical device

                var mess = '' + data.message + ' ' + data.title + ' ' + data.count + ' ' +
                data.sound + ' ' + data.image + ' ' + data.additionalData;
                console.log('PushNotification: ', mess);
            });

            push.on('error', function (e) {
                console.log('PushNotification: ', e.message);
            });
        }

    })
});
4

I have received notification. but when app is open how can show message in UI?

5

You can simply create an $rootScope.notifications variable when you receive an notification and show an DOM HTML element when that event happened

Javascript:

push.on('notification', function (data) {
    var mess = '' + data.message + ' ' + data.title + ' ' + data.count + ' ' +
    data.sound + ' ' + data.image + ' ' + data.additionalData;
           
    $rootScope.notifications = [];
    $rootScope.notifications.push(mess);
});

<html>
    <div ng-show="notifications">
        Show this message
    </div>
</html>