bootstraping angular value provider - angularjs

Question

My app.js, service.js, controller.js are declared as below. My problem is the controller only pickup the initial values {userId: -1, networkName: 'xyz'} set in the service.js, even though the values are changed to { userId: 129, networkName: 'mydomainaccoutname' } in myApp.run() block in the app.js. I have correctly injected the value provider to myApp.run() as well as the controller. How do I get the controller to pick up the updated values? Thanks.
app.js
(function () {
'use strict';
//debugger;
var myApp = angular.module('myApp', [
// Angular modules
'ngAnimate', // animations
//'ngRoute', // routing
'ngSanitize', // sanitizes html bindings (ex: sidebar.js)
'ui.router', // state routing
'ui.grid',
'ui.grid.pagination',
'ngResource', // RESTful resource
// Custom modules
'common', // common functions, logger, spinner
'common.bootstrap', // bootstrap dialog wrapper functions
// 3rd Party Modules
'ui.bootstrap' // ui-bootstrap (ex: carousel, pagination, dialog)
]);
myApp.run(['$templateCache', '$rootScope', '$state', '$stateParams', 'currentUserAccount', 'userFactory',
function ($templateCache, $rootScope, $state, $stateParams, currentUserAccount, userFactory) {
//currentUserAccount is a value provider service
currentUserAccount = { userId: 129, networkName: 'mydomainaccoutname' };
}]);
})();
service.js
'use strict';
angular.module('myApp')
.value('version', '5.0')
.value('currentUserAccount', {
userId: -1,
networkName: 'xyz'
});
controller.js
(function () {
'use strict';
//debugger;
var controllerId = 'shellCtrl';
angular.module('cmtApp').controller(controllerId,
['$rootScope', 'common', 'config', 'currentUserAccount', shell]);
function shell($rootScope, common, config, currentUserAccount) {
var vm = this;
var logSuccess = common.logger.getLogFn(controllerId, 'success');
var events = config.events;
vm.busyMessage = 'Please wait ...';
vm.isBusy = true;
vm.isAdmin = false;
vm.currentUser = currentUserAccount;
vm.spinnerOptions = {
radius: 40,
lines: 7,
length: 0,
width: 30,
speed: 1.7,
corners: 1.0,
trail: 100,
color: '#F58A00'
};
activate();
function activate() {
logSuccess('CMT loaded!', null, true);
common.activateController([], controllerId);
}
};
})();

Answer 1

Why not use a actual service instead? You can have your service like follows.
angular.module('app')
.service('UserService', [function() {
var currentUser = {
userId: -1,
networkName: 'xyz'
};
var getCurrentUser = function() {
return currentUser;
};
var setCurrentUser = function(user) {
currentUser = user;
};
// public functions
return {
getCurrentUser: getCurrentUser,
setCurrentUser: setCurrentUser
};
}]);
Then in your controller, you can do something like this:
(function () {
'use strict';
//debugger;
var controllerId = 'shellCtrl';
angular.module('cmtApp').controller(controllerId,
['$rootScope', 'common', 'config', 'UserService', shell]);
function shell($rootScope, common, config, UserService) {
var vm = this;
....
vm.currentUser = UserService.getCurrentUser();
...
};
})();
Then in your app runner:
myApp.run(['$templateCache', '$rootScope', '$state', '$stateParams', 'UserService', 'userFactory',
function ($templateCache, $rootScope, $state, $stateParams, currentUserAccount, userFactory) {
//currentUserAccount is a value provider service
UserService.setCurrentUser({ userId: 129, networkName: 'mydomainaccoutname' });
}]);