shaunxu/store user login status in service

## store user login status in service
<html data-ng-app="app">
    <head>
        <script type="text/javascript" src="lib/angular/angular.js"></script>
        <script type="text/javascript">
            var app = angular.module('app', []);

            app.service('AuthService', function () {
                var username = '';

                return {
                    login: function (uid) {
                        username = uid;
                    },
                    logout: function () {
                        username = '';
                    },
                    isLoggedIn: function () {
                        return username && username.length > 0;
                    },
                    getUsername: function () {
                        return username;
                    }
                };
            });

            app.controller('LoginCtrl', function ($scope, AuthService) {
                $scope.uid = '';

                $scope.login = function () {
                    AuthService.login($scope.uid);
                };
            });

            app.controller('UserBarCtrl', function ($scope, AuthService) {
                $scope.$watch(AuthService.isLoggedIn, function (isLoggedIn) {
                    $scope.name = AuthService.getUsername();
                    $scope.isLoggedIn = isLoggedIn;
                });

                $scope.logout = function () {
                    AuthService.logout();
                };
            });
        </script>
    </head>
    <body>
        <div data-ng-controller="UserBarCtrl">
            <p data-ng-show="isLoggedIn">Welcome {{name}} ! <a href="#" data-ng-click="logout()">Logout</a></p>
            <p data-ng-show="!isLoggedIn">Please log in.</p>
        </div>
        <div data-ng-controller="LoginCtrl">
            <p>
                <input type="text" data-ng-model="uid" />
            </p>
            <p>
                <input type="button" value="Login" data-ng-click="login()" />
            </p>
        </div>
    </body>
</html>
	<html data-ng-app="app">
	<head>
	<script type="text/javascript" src="lib/angular/angular.js"></script>
	<script type="text/javascript">
	var app = angular.module('app', []);

	app.service('AuthService', function () {
	var username = '';

	return {
	login: function (uid) {
	username = uid;
	},
	logout: function () {
	username = '';
	},
	isLoggedIn: function () {
	return username && username.length > 0;
	},
	getUsername: function () {
	return username;
	}
	};
	});

	app.controller('LoginCtrl', function ($scope, AuthService) {
	$scope.uid = '';

	$scope.login = function () {
	AuthService.login($scope.uid);
	};
	});

	app.controller('UserBarCtrl', function ($scope, AuthService) {
	$scope.$watch(AuthService.isLoggedIn, function (isLoggedIn) {
	$scope.name = AuthService.getUsername();
	$scope.isLoggedIn = isLoggedIn;
	});

	$scope.logout = function () {
	AuthService.logout();
	};
	});
	</script>
	</head>
	<body>
	<div data-ng-controller="UserBarCtrl">
	<p data-ng-show="isLoggedIn">Welcome {{name}} ! <a href="#" data-ng-click="logout()">Logout</a></p>
	<p data-ng-show="!isLoggedIn">Please log in.</p>
	</div>
	<div data-ng-controller="LoginCtrl">
	<p>
	<input type="text" data-ng-model="uid" />
	</p>
	<p>
	<input type="button" value="Login" data-ng-click="login()" />
	</p>
	</div>
	</body>
	</html>