在Angular 6和Phonegap上推送通知

Question

I have to implement push notifications handling in app written in Angular 6 and Phonegap. I installed phonegap-push-plugin and generally it works, when I use it in index.html:

function onLoad() {
  document.addEventListener("deviceready", onDeviceReady, false);
  if (device.platform === 'Android') {
    setPushNotifications();
  } else {
    pushID = null;
  }
}

function setPushNotifications() {
  push = PushNotification.init({
    "android": {
      "senderID": "xxx",
      "icon": "notify_icon",
      "iconColor": "#1f5382"
    },
    "ios": {
      "sound": true,
      "vibration": true,
      "badge": true
    },
  });

  push.on('registration', (data) => {
    pushID = data.registrationId;
  });
  push.on('notification', data => {
    alert('PUSH arrived!');
    // go to another view in Angular... HOW :(
  });
}

I get notifications, system displays it, but now I have to go to eg. news page with id from notification. I can't do this via window.location, and when I try to declare var PushNotification: any; in app.component constructor, TS tells me, that PushNotification is not declared. Any tips?

Answer 1

You need to wrap platformBrowserDynamic().bootstrapModule(AppModule) in onDeviceReady in main.ts:

const onDeviceReady = () => {
  platformBrowserDynamic().bootstrapModule(AppModule)
    .catch(err => console.log(err));
}

document.addEventListener('deviceready', onDeviceReady, false);

Otherwise AppModule is firing before cordova plugin is loaded, that's why u have PushNotification undefined.

Second thing is:

I try to declare var PushNotification: any; in app.component constructor

declare let PushNotification: any; should be outside of AppComponent class.