-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
55 lines (47 loc) · 1.82 KB
/
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
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
<!DOCTYPE html>
<html>
<head>
<title>Sample Angular App</title>
<script type="text/javascript" src="angular.js"></script>
<script type="text/javascript" src="app.js"></script>
<style>
body{font-family: sans-serif;}
.example-section{ padding:10px; border-bottom: 1px solid gray;}
.reddit-item { margin-bottom: 10px; }
h3 { font-size: 12pt;}
</style>
</head>
<body ng-app="steven">
<div ng-controller="MainController">
<div id="model-binding-example" class="example-section">
<h2>Type here for live update fun with ng-model / ng-bind</h2>
<input ng-model="someModel" placeholder="Type something">
<!-- the second input will reflect the data in the first -->
<input ng-model="someModel" disabled="disabled" placeholder="Don't type here">
<h3 ng-bind="someModel"></h3>
</div>
<div id="event-handling-example" class="example-section">
<h2>Click the buttons to mutate the array</h2>
{{sampleArray}}
<ul>
<li ng-repeat="item in sampleArray track by $index">{{item}}</li>
</ul>
<p ng-show="sampleArray.length > 4">Array is bigger than four items</p>
<p ng-hide="sampleArray.length > 4">Array is smaller than five items</p>
<button ng-click="removeSomething()">Click me to delete</button>
<button ng-click="addSomething()">or click me to add</button>
</div>
<div id="retrieve-data-example" class="example-section" >
<h2>Info from the reddit API</h2>
<div ng-repeat="item in redditArray" class="reddit-item">
<h3> <a href="http://reddit.com{{item.data.permalink}}" ng-bind="item.data.title"></a></h3>
<img src="{{item.data.thumbnail}}">
From {{item.data.author}}
<a href="{{item.data.url}}">source</a>
<a href="http://reddit.com{{item.data.permalink}}">reddit item</a>
<a href="http://reddit.com/r/{{item.data.subreddit}}">{{item.data.subreddit}}</a>
</div>
</div>
</div>
</body>
</html>