Ionic 2 push notification action button click callback using typescript

Question

I am exploring Ionic 2 push plugin in my ionic application. I have added push plugin and send notification to my app. Now my requirement is to click on notification action button and how to link the callback within my code. Here I mentioned my notification JSON sample to push notification with action button.

"data":{
"title":"Data title",
"message":"Data message",
"information": "Information",
"actions": [
            { "icon": "approve_icon", "title": "APPROVE", "callback": "", "foreground": true},
            { "icon": "reject_icon", "title": "REJECT", "callback": "", "foreground": true}
        ]
}

Here I leave callback parameter as empty. how can I link my approve and reject method into this callback parameter. Help me please.

score 0 · Answer 1 · answered Aug 04 '17 at 11:50

I'm looking at the documentation, I'm assuming that this is the plugin you're referring to. If not, it would be helpful for you to link the github page of the plugin in question.

Reading the examples, there doesn't appear to be immediate help, but fear not, someone on the ionic forums had the same issue. From one of the examples there, it appears you can just put your function in the JSON as so:

{
  "data": {
    "title": "You have unread chats!",
    "message": "Click here to read them.",
    "actions": [
        { "title": "VIEW CHATS", "callback": "pushListener.callbacks.viewChats", "foreground": true},
        { "title": "SNOOZE", "callback": "pushListener.callbacks.snooze", "foreground": true}
    ]
  },
  "registration_ids":["foobar"]
}

Essentially, from my understanding, if you put the classname.functionname in the callback parameter, that is the function that will get called.

Hope this helps!

I tried like this. But our custom event approve not acceptable to this method. push.on('approve', (e) => { console.log(e); }); — Sundaramoorthy J, Aug 04 '17 at 13:01

score 0 · Answer 2 · answered Aug 22 '17 at 10:06

I have achieved the required solution. Notification action button callback should be like this within your launcher class. (i.e) You have to place the callback within app.component.ts. Its working perfectly.

(<any>Window).approve = function (data: any) {
  alert('Approve called); 
};

(<any>Window).reject = function (data: any) {
  alert('Reject called);   
}

//Payload for android

"data": {
    "title": "Push notification",
    "message": "Push notification with action button",
    "actions": [
        { "icon": "approve_icon", "title": "Approve", "callback": "Window.approve", "foreground": true},
        { "icon": "reject_icon", "title": "Reject", "callback": "Window.reject", "foreground": true}
    ]
}

Ionic 2 push notification action button click callback using typescript

2 Answers2