Assign value to the Factory variable through http

Question

I have two controllers and one Factory. I am using angular-devise module for authentication.

UserFactory.js

myApp.factory('Userfactory', function(Auth,$location){
 var Userfactory = {}

 Userfactory.user = []
 Userfactory.active = false

 Userfactory.isLogged = function(){
  if(!Userfactory.active[0]){
    return Auth.currentUser().then(function(user) {
      Userfactory.user.push(user)
      Userfactory.active = angular.copy(true)
     }, function(error) {
    });
   }
  }
  return Userfactory;
 })

UserController.js

myApp.controller("userController",function($scope,Userfactory){
  Userfactory.isLogged().then(function(){
    $scope.active = Userfactory.active;
  })
}

NavController.js

myApp.controller("navController", function navController(Userfactory){
  this.user = Userfactory.user;
  this.active =  Userfactory.active;
})

UserFactory.active in nav controller is not updating when isLogged updates the value , since the value is getting resetted (which breaks binding) , where as in user controller the value is assigned through promise , so its getting the latest value. My doubt is how to manage to get it working in both places, meaning how to assign value without breaking the binding.

One workaround is declaring Userfactory.active as an array and pushing the value to it as true or false, but looking for better way of doing it, any help will be useful.

Answer 1

I would recommend you to use a model Object to wrap all the variables/properties you need to be bindable.

myApp.factory('Userfactory', function(Auth,$location){
 var Userfactory = {}

 Userfactory.model = {
   user: undefined,
   active: false
 };

 Userfactory.isLogged = function(){
  if(!Userfactory.active[0]){
    return Auth.currentUser().then(function(user) {
      Userfactory.model.user = user;
      Userfactory.model.active = true;
     }, function(error) {
    });
   }
  }
  return Userfactory;
 })

And then on your controllers:

myApp.controller("userController",function($scope,Userfactory){
  Userfactory.isLogged().then(function(){
    $scope.userModel = Userfactory.model;
    // and on the UI use: userModel.active
  })
}

myApp.controller("navController", function navController(Userfactory){
  this.userModel = Userfactory.model;
  // then access it like: this.userModel.active
})