forked from paul-hammant/whack_a_mole_angular
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
30 lines (30 loc) · 964 Bytes
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<!DOCTYPE html>
<html ng-app="WAM">
<head>
<script type="text/javascript"
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
<title>Whack-a-mole Angular Edition</title>
</head>
<body ng-controller="WamCtrl">
<table bgcolor="green">
<tr ng-repeat="moleRow in moleTable">
<td ng-repeat="mole in moleRow.moles">
<img src="mole-true.png" ng-show="mole.up" ng-click="mole.up = false">
<img src="mole-false.png" ng-hide="mole.up" ng-click="mole.up = true">
</td>
</tr>
</table>
<!-- Angular Model data isn't normally shown in the page; here for debugging purposes-->
<pre>
{{moleTable | json}}
</pre>
</body>
<script type="text/javascript">
var myApp = angular.module('WAM', []);
myApp.controller('WamCtrl', ['$scope', '$http', function($scope, $http) {
$http.get('moleTable.json').success(function(data){
$scope.moleTable = data;
});
}]);
</script>
</html>