Warning: This solution is now depricated since PushNotificationsV5. You may still find it useful however should you be working with an older code-base.

If you are making an application in Phone Gap or Cordova and have chosen to build ontop of one of these using the front-end development framework AngularJS then you may be scratching your head over how to get push notifications working. Though both PhoneGap and Cordova have good support for push notifications we couldn't find a decent plugin that allowed AngularJS to easily receive push notifications.

We have written a small module that solves this problem and have licenced it under the MIT open source licence (so it is free to use). Here are some simple bullet form instructions:

Simple installation instructions

Download the AngularJS Plugin

Download our AngularJS push notification plugin and example

Requirements

  • Cordova 3
  • AngularJs

Android Pre-requisites

  • Google Cloud Messaging Project ID
  • Google Cloud Messaging API Key for above Project ID (need for server)

iOS Pre-requisites

  • App ID configured for Push Notifications on Apple Developer Portal
  • SSL Certificate and private key (need for server)

Install Required Plugins

cordova plugin add org.apache.cordova.device org.apache.cordova.vibration org.apache.cordova.dialogs org.apache.cordova.media https://github.com/phonegap-build/PushPlugin.git

Include external scripts

Include following script lines to your index.html to reference the PushNotification plugin.
<script type="text/javascript" src="push.js"></script><script type="text/javascript" src="pushnotification.js"></script>

Plugin can be downloaded here.

AngularJs modifications

Initialise Push Plugin in AngularJs by adding module pushNotify

To register device on Angular App initialise, add following lines in your angular app:

pushNotification.registerPush();

Store the returned device registration ID to send future notifications to device

To send send push notifications

  • For android push notifications, use included android-server.php file.
  • Make sure to replace Google API key, and add array for devices to which you want to send notifications.

Example

AngularJs example included with file named angular-example.js within this zip file.