Skip to content

Instantly share code, notes, and snippets.

@johnlindquist
Last active August 29, 2015 14:21
Show Gist options
  • Save johnlindquist/71ca2f64c26886a6dab1 to your computer and use it in GitHub Desktop.
Save johnlindquist/71ca2f64c26886a6dab1 to your computer and use it in GitHub Desktop.
<!doctype html>
<html lang="en" ng-app="workshop">
<head>
<meta charset="UTF-8">
<title>AngularJS Jumpstart</title>
<link rel="stylesheet" href="bootstrap.min.css"/>
<script src="angular.js"></script>
<script src="workshop.js"></script>
</head>
<body ng-controller="BodyController as body">
<input type="text" ng-model="body.searchTerm"/>
<table class="table table-bordered">
<thead>
<tr>
<th ng-click="body.setSortOrder('name')">Name</th>
<th ng-click="body.setSortOrder('price')">Price</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="fruit in body.data
| filter: body.searchTerm
| orderBy: body.sortOrder">
<td>{{fruit.name}}</td>
<td>{{fruit.price}}</td>
</tr>
</tbody>
</table>
</body>
</html>
angular.module("workshop", [])
.controller("BodyController", function(){
var body = this;
body.searchTerm = "";
body.sortOrder = "";
body.setSortOrder = function(value){
if(body.sortOrder === value){
body.sortOrder = "-" + value;
}else{
body.sortOrder = value;
}
};
body.data = [
{name: "banana", price: "$5.00"},
{name: "apple", price: "$3.00"},
{name: "orange", price: "$1.00"}
];
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment