JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 64
  • Score
    100M100P100Q42547F
  • License MIT

Native bindings for phoenix in angular

Package Exports

  • angular-phoenix

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (angular-phoenix) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Angular Phoenix

Provides angular bindings to Phoenix so we can run events within the digest loop.

I've also taken the liberty of Promisifying phoenix!

Installing

$ bower install --save angular-phoenix

Note: You must have the original phoenix.js loaded prior to this, it also makes use of promises so please have a promise library loaded or be using ES6!

How to use

This is incomplete and only allows for a single socket connection per client

First we need to set our socket base url and add a global dependency.

angular.module('myApp', ['angular-phoenix'])

.config(['PhoenixProvider', PhoenixProvider => {
  PhoenixProvider.setUrl('ws//localhost:9000/ws')
}])

Now were ready!!!

Joining a channel

You can only join a channel once, if you provide a new message it will leave then rejoin the channel. Just like normal phoenix we call Phoenix.join however we also can take scope!

Phoenix.join('name', {})
  .receive(chann => {
    // Now our callbacks will get removed on scope destruction
    chann.on(scope, 'message', handler)
    chann.on('message', hander)
  })

Phoenix.join('name', {}).promise
  .then(chann => {
    // Now our callbacks will get removed on scope destruction
    chann.on(scope, 'message', handler)
    chann.on('message', hander)
  })

Why add a promise?

For things like UI-Router this allows you to join into a channel as a resolve property!!

Leaving a channel

Phoenix.leave('name')

Accessing base phoenix or current socket

Phoenix.base // Contains original Phoenix
Phoenix.socket // Contains your current socket