Create a gist now

Instantly share code, notes, and snippets.

Embed
What would you like to do?
<!DOCTYPE html>
<html>
<head>
<title>Experiment with AngularJS -1 ( Contact Search Application )</title>
</head>
<style>
tr:nth-child(even) {
background-color: #EBF5FF;
}
tr:nth-child(odd) {
background-color: #E6E6E6;
}
</style>
<body>
<div ng-app="contacts" ng-controller="ContactSearch">
<label>Search for contacts:</label>
<input type="text" name="searchFor" ng-keyup="search()" ng-model="searchFor"/><span style="font-size:9px">('john','james' etc)</span>
<div style="width:75%;padding:15px 0 0 10px">
<div style="float:left;min-height:250px">
<table cellspacing="0" cellpadding="0" border="0" width="100%">
<tr ng-repeat="contact in contacts | orderBy:'name':false">
<td>
<a href="#detail/{{ contact.id }}">{{ contact.name }}</a>
</td>
</tr>
</table>
</div>
<div style="margin-left:150px" ">
<div ng-view style="background:#F5F0E6;width:300px">
</div>
</div>
</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular-route.js"></script>
<script src="app.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment