angularjs - Transfer Loggedin status to another controller in Angular -
i've been trying implement easy feature in angular, without no success.
i have 2 controllers , 1 service. service provides shared methods retrieve if user logged in or not;
app.factory("shared",["$rootscope",function($rootscope){ var data = {}; data.val = false; data.get = function() { return data.val; }, data.set = function(val) { data.val = val; }; return data; }]);
then have controller attached login/logout bar login , logout links should changed of ng-show , ng-hide. here html code this:
<ul class="reg" ng-controller="maincntr"> <li ng-hide="shared.get()"><a href="/register"> signup </a></li> <li ng-hide="shared.get()"><a href="/login">login</a></li> <li ng-show="shared.get()"><a href="/logout">logout</a></li> </ul>
and maincntr attached this:
app.controller("maincntr,["$scope","shared","$rootscope",function($scope,shared, $rootscope){ $scope.$watch("shared.get()",function(newval){ console.log(newval); },true); }]);
and lastly, have login controller login form rendered when on /login page. should notice above html login/signup links on index.html page. so, logincntr below:
app.controller("logincntr",["$scope","$http", "$window","$rootscope", "$location","shared",function($scope,$http, $window, $rootscope,$location,shared){ $scope.login = ""; $scope.password = ""; $scope.response = ""; $scope.loggedin = false; $scope.submit = function(isvalid) { if (isvalid) { $http({ method: "post", url: "/authenticate", data: $.param({login:$scope.login,password:$scope.password}), headers: {"content-type": "application/x-www-form-urlencoded"} }).success(function(data,status,headers,config){ $window.sessionstorage.token = data.token; console.log($window.sessionstorage.token); $scope.response = "you logged in successfully"; shared.set(true); /////// here set shared valued true when user logged }).error(function(data,status,error,config){ delete $window.sessionstorage.token; $scope.response = data.response; }); }; }; }]);
so, that's it, doesn't work. being new angular, hard time me figure out wrong. may it's because "shared" value set in asynchronyous callback , never read, because login section has been loaded?
why not try $emit event listener. :
///****maincntr app.controller("maincntr,["$scope","shared","$rootscope",function($scope,shared, $rootscope){ $scope.$on("loginevent", function($event, args){ alert(args.msg); });//listen $emit event }]); ///****logincntr app.controller("logincntr",["$scope","$http", "$window","$rootscope", "$location","shared",function($scope,$http, $window, $rootscope,$location,shared){ $scope.login = ""; $scope.password = ""; $scope.response = ""; $scope.loggedin = false; $scope.submit = function(isvalid) { if (isvalid) { $http({ method: "post", url: "/authenticate", data: $.param({login:$scope.login,password:$scope.password}), headers: {"content-type": "application/x-www-form-urlencoded"} }).success(function(data,status,headers,config){ $window.sessionstorage.token = data.token; console.log($window.sessionstorage.token); $scope.response = "you logged in successfully"; $scope.$emit("loginevent", {msg : "login successful..."}) /////// emit event }).error(function(data,status,error,config){ delete $window.sessionstorage.token; $scope.response = data.response; }); }; }; }]);
Comments
Post a Comment