Angular: ng-include - murtaza52
http://angularjs.org/
by mrajcok
HTML
<div ng-controller="LoginCtrl" class="span4 pull-right">
<div ng-switch on="loginStatus()">
<div ng-switch-when="false" ng-include src="'/login_form.html'"></div>
<div ng-switch-when="true" ng-include src="'/profile_links.html'"></div>
</div>
</div>
<script type="text/ng-template" id="/login_form.html">
<form class="form-inline">
<input type="text" placeholder="Email" ng-model="userEmail" class="input-small"/>
<input type="password" placeholder="Password" ng-model="userPassword" class="input-small"/>
<button type="submit" ng-click="login(userEmail, userPassword)" class="btn">Sign In</button>
</form>
</script>
<script type="text/ng-template" id="/profile_links.html">
profile_links.html
</script>
JavaScript
var myApp = angular.module('myApp', []);
function LoginCtrl($scope, currentUser) {
$scope.loginStatus = function() {
return currentUser.isLoggedIn();
};
$scope.login = function(email, password) {
currentUser.login(email, password);
// console.log($scope);
};
$scope.logout = function() {
currentUser.logout();
};
// console.log($scope)
}
myApp.factory('currentUser', function($rootScope) {
var allUsers = {
"[email protected]": {
name: "Robert Patterson",
role: "Admin",
email: "[email protected]",
password: "rob"
},
"[email protected]": {
name: "Steve Sheldon",
role: "User",
email: "[email protected]",
password: "steve"
}
}
var isUserLoggedIn = false;
// Public API here
return {
login: function(email, password) {
var user = allUsers[email];
var storedPass = user.password;
if (storedPass === password) {
isUserLoggedIn = true;
return true;
}
else {
return false;
}
},
logout: function() {
$rootScope.$broadcast('logout');
isUserLoggedIn = false;
},
isLoggedIn: function() {
return isUserLoggedIn;
}
};
});