<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example - example-example104-production</title>
<style>
.selected { background-color: red; }
</style>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0-rc.0/angular.min.js"></script>
<script src="script.js"></script>
</head>
<body ng-app="orderByExample">
<div ng-controller="ExampleController">
<table class="friend">
<tr>
<th>Name</th>
<th>Phone Number</th>
<th>Age</th>
</tr>
<tr ng-repeat="friend in friends | orderBy:'-age'" ng-class="{'selected': is_highlight(friend) }">
<td>{{friend.name}}</td>
<td>{{friend.phone}}</td>
<td>{{friend.age}}</td>
</tr>
</table>
</div>
</body>
</html>
(function(angular) {
'use strict';
angular.module('orderByExample', [])
.controller('ExampleController', ['$scope', function($scope) {
$scope.friends =
[{name:'John', phone:'555-1212', age:10},
{name:'Mary', phone:'555-9876', age:19},
{name:'Mike', phone:'555-4321', age:21},
{name:'Adam', phone:'555-5678', age:35},
{name:'Julie', phone:'555-8765', age:29}];
$scope.is_highlight = function(f) {
if (f.age > 25) {
return true;
}
return false;
};
}]);
})(window.angular);