I'm trying to make a simple with login features using Angularjs. I've seperated the controllers and made a service that autheticates the user with a Firebase server. Another thing I should mention is that I'm using their API called Angular Fire.The problem is that I'm trying to trigger a $rootScope.$on function. Here's the code:

myApp.controller('StatusController', function($scope, $rootScope, $firebase, $firebaseAuth) {

    console.log($rootScope);

    $rootScope.$on('$firebaseAuth:authWithPassword', function(e, authUser){
        console.log("printsomething");
        $scope.userEmail = authUser.userEmail;
    }); //$firebaseAuth:login
});//StatusController

And here is authentication service:

myApp.factory('Authentication', function ($firebase, $firebaseAuth, FIREBASE_URL, $location) {

    var ref = new Firebase(FIREBASE_URL);
    console.log(FIREBASE_URL);
    var simpleLogin = $firebaseAuth(ref);

    var myObject = {
        login: function (user) {
            return **simpleLogin.$authWithPassword**({
                email: user.email,
                password: user.password
            });
        } //login
    } //myObject
    return myObject;
})

Here is the where the Authentication is being called. In my registration controller:

myApp.controller('RegistrationController', function($scope, $firebaseAuth, $location, Authentication) {


$scope.login = function() {
    Authentication.login($scope.user)
    .then(function(user) {
        $location.path('/meetings');
    }, function(error) {
        $scope.message = error.toString();
    });
}//login
$scope.register = function() {
    $location.path('/register');
}//register
});//

I even logged the root scope to see if I had the right parameter inside the $on() function:

$$listeners: Object$firebaseAuth:authWithPassword: Array[1]0: function (e, authUser){length: 1
__proto__: Array[0]

Please if anyone can help I would appreciate it.

I'm trying to make a simple with login features using Angularjs. I've seperated the controllers and made a service that autheticates the user with a Firebase server. Another thing I should mention is that I'm using their API called Angular Fire.The problem is that I'm trying to trigger a $rootScope.$on function. Here's the code:

myApp.controller('StatusController', function($scope, $rootScope, $firebase, $firebaseAuth) {

    console.log($rootScope);

    $rootScope.$on('$firebaseAuth:authWithPassword', function(e, authUser){
        console.log("printsomething");
        $scope.userEmail = authUser.userEmail;
    }); //$firebaseAuth:login
});//StatusController

And here is authentication service:

myApp.factory('Authentication', function ($firebase, $firebaseAuth, FIREBASE_URL, $location) {

    var ref = new Firebase(FIREBASE_URL);
    console.log(FIREBASE_URL);
    var simpleLogin = $firebaseAuth(ref);

    var myObject = {
        login: function (user) {
            return **simpleLogin.$authWithPassword**({
                email: user.email,
                password: user.password
            });
        } //login
    } //myObject
    return myObject;
})

Here is the where the Authentication is being called. In my registration controller:

myApp.controller('RegistrationController', function($scope, $firebaseAuth, $location, Authentication) {


$scope.login = function() {
    Authentication.login($scope.user)
    .then(function(user) {
        $location.path('/meetings');
    }, function(error) {
        $scope.message = error.toString();
    });
}//login
$scope.register = function() {
    $location.path('/register');
}//register
});//

I even logged the root scope to see if I had the right parameter inside the $on() function:

$$listeners: Object$firebaseAuth:authWithPassword: Array[1]0: function (e, authUser){length: 1
__proto__: Array[0]

Please if anyone can help I would appreciate it.

• javascript
• angularjs
• angularjs-scope
• firebase
• angularfire

Share Improve this question Follow edited Nov 21, 2014 at 1:04 gmetrix asked Nov 20, 2014 at 23:38 gmetrixgmetrix 1311 silver badge44 bronze badges 4

• Where is your Authentication service used? Do you authenticate with Firebase in any other locations in your code? – GregL Commented Nov 21, 2014 at 0:07
• I cannot see anywhere in the code for AngularFire where it is broadcasting the $firebaseAuth:authWithPassword event. Is that an event you are broadcasting in your code somewhere? – GregL Commented Nov 21, 2014 at 0:54
• If you look at the authentication service it should be there. $firebaseAuth is a reference so it should have something – gmetrix Commented Nov 21, 2014 at 1:02
• Turns out not so much, as James' answer confirms. :-) – GregL Commented Nov 21, 2014 at 1:29

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 6

Angular Fire will not broadcast an event on the scope. You will need to do that from within the promise pletion callback. I would remend doing so in your Authentication service.

myApp.factory('Authentication', function ($rootScope, $firebase, $firebaseAuth, FIREBASE_URL, $location) {

  var ref = new Firebase(FIREBASE_URL);
  console.log(FIREBASE_URL);
  var simpleLogin = $firebaseAuth(ref);

  var myObject = {
      login: function (user) {
          return simpleLogin.$authWithPassword({
              email: user.email,
              password: user.password
          }).then(function(authData){
              $rootScope.$broadcast('$firebaseAuth:authWithPassword',authData);
              return authData;
          });
      } //login
  } //myObject
  return myObject;
})

You return authData at the end of your handler so you can chain additional actions on to the same promise (as you do in RegistrationController).

I think your probably looking at a slightly outdated tutorial like I was. I dug into the the Firebase docs a little bit and came up with these for the new Authentication and Status code. Basically they have an $onAuth listener that you can just use now.

Authentication:

myApp.factory('Authentication',function($firebase,$firebaseAuth,$location,FIREBASE_URL,       $rootScope){
var ref = new Firebase(FIREBASE_URL);
var simpleLogin = $firebaseAuth(ref);

var myObject = {
    login : function(user){
        return simpleLogin.$authWithPassword({
            email: user.email,
            password: user.password
        })
    },//login

    logout: function(){
        console.log("calling unauth");
        return simpleLogin.$unauth();   
    }
}//myObject

return myObject;

});

Status:

myApp.controller('StatusController', function($scope, $rootScope,$firebaseAuth, FIREBASE_URL, $location, Authentication){
var ref = new Firebase(FIREBASE_URL);
var authObj = $firebaseAuth(ref);

$scope.logout = function(){
    Authentication.logout();
    $location.path('/login');
}

authObj.$onAuth(function(authData) {
if (authData) {
    console.log("Logged in as:", authData.password.email);
    $scope.userEmail = authData.password.email;
  } else {
    console.log("Logged out");
    $scope.userEmail = null;
  }
});

});

I suspect that your StatusController isn't active when the login is performed by the RegistrationController. By any chance, is StatusController the controller for the /meetings route? If that's the case, your controller is just "too late" to hear the event being emitted.