firebase onAuth() throwing: TypeError cannot read property 'auth' of undefined

I'm using Firebase as my main backend solution and have created a service for dealing with auth throughout the app (since I started to use simpleLogin and now I'm trying to use their built in login methods, I figured it might be better to just make all that scoped before accessing it from the rest of the application).

My firebase reference is working fine and so it is the auth methods.
But the listening methods onAuth() and offAuth() are throwing this error:

Uncaught TypeError: Cannot read property 'auth' of undefined - firebase-debug.js:9954

Is this a bug with firebase itself or does anyone see something I'm doing wrong? Tried to play around with angular versions and turning off other bower packages like angularfire and firebase-simple-login but have had no success so far.

My auth service code is as follows and I'm not doing anything beyond defining my url on a .constant service.

    angular.module('myApp')
    .factory('auth', function (firebaseAPIUrl) {

      var ref = new Firebase(firebaseAPIUrl),
          onAuth = ref.onAuth,
          offAuth = ref.offAuth;

      onAuth(function (authData) {
        console.log(authData);
      });

      function getCurrentUser() {
        return ref.getAuth();
      }

      ...

      return {
        onAuth: onAuth,
        offAuth: offAuth,
        getCurrentUser: getCurrentUser,
        ...
      }
    }


ANSWERS:


In JavaScript, when passing around a function for later invocation, it is important to be mindful of the scope with which that function will be invoked. When defining closures, for example, the closure will have its own scope and this may no longer point to our original object. Using fn.bind(...) addresses this issue.

This can get tricky, as the code you're working with might depend on a particular scope. The trick is to ensure that the scope hasn't changed as you're passing around the function as an argument, and this can be achieved by explicitly binding the method to the original object before passing it around.

Check out and for deeper dives on this topic.



 MORE:


 ? Cannot read property firebase of undefined error
 ? Accessing element height in NativeScript
 ? Nativescript canvas
 ? Is there localstorage in nativescript?
 ? $index not working in Nativescript
 ? In NativeScript with Angular2, how can I get an interface element the id?
 ? In NativeScript with Angular2, how can I get an interface element the id?
 ? In NativeScript with Angular2, how can I get an interface element the id?
 ? In NativeScript with Angular2 get element value
 ? How to show and bind base64 string to Image as a source in Nativescript?