AngularJs Toggle Class using ng-class

<!DOCTYPE html>
<html lang="en">
<head>
 <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js"></script>
 <script>
var myApp = angular.module("myApp", []);
 myApp.controller("myController", function($scope) {
 $scope.blueBg = true;
$scope.toggleBg = function(selectedOpt) {
	if($scope.blueBg == true){
    $scope.blueBg = false;
	}else{
	$scope.blueBg = true;	
	}
};
});
</script> 
<style type='text/css'>
.class1{	
	background:yellow;
}
.class2{	
	background:blue;
}
</style>
</head>
<body>  
<div ng-app="myApp">  
<div ng-controller="myController">  
<div style='width:200px;height:200px;' ng-class="{'class1':!blueBg, 'class2': blueBg}">{{ blueBg }}</div>
<a href="javascript:void(0);" ng-click='toggleBg();'>ToggleBg</a>
</div>  
</div> 

</body>  
</html>