Skip to content

Instantly share code, notes, and snippets.

@ericdouglas
Created January 29, 2014 17:32
Show Gist options
  • Save ericdouglas/8692874 to your computer and use it in GitHub Desktop.
Save ericdouglas/8692874 to your computer and use it in GitHub Desktop.
Study of "Recipes With AngularJS" - Chapter 1 - Recipe 3 - Example 01
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Chapter 1 - Recipe 3 - Example 01</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.min.js"></script>
<link rel="stylesheet" href="css/bootstrap.css">
<script src="example-01-03-01.js"></script>
</head>
<body ng-app ng-controller="Controller">
<div class="alert alert-{{ state }}">
<h1 ng-show="visible">Bushido AngularJS</h1>
<h3>The Ultimate Way to Learn AngularJS with Confidence</h3>
</div>
<p><button ng-click="toggle()" class="btn btn-primary btn-lg">Hide the title!</button></p>
</body>
</html>
function Controller ( $scope ) {
$scope.visible = true;
$scope.state = "info";
$scope.toggle = function () {
$scope.visible = !$scope.visible;
if ($scope.state === "info") {
$scope.state = "success";
} else if ($scope.state === "success") {
$scope.state = "info";
}
};
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment