Custom Array Filter Example

HTML

<script src="http://docs-next.angularjs.org/angular-0.10.5.min.js" ng:autobind></script>

<!-- AngularJS Example Code: -->
<div ng:controller="FilterCtrl">
{{result}}
    <div ng:init="friends = [{name:'John', phone:'555-1276'},
                             {name:'Mary', phone:'800-BIG-MARY'},
                             {name:'Mike', phone:'555-4321'},
                             {name:'Adam', phone:'555-5678'},
                             {name:'Julie', phone:'555-8765'}]"></div>
     Search: <input ng:model="searchText"/>
    <table id="searchTextResults">
      <tr><th>Name</th><th>Phone</th><tr>
      <tr ng:repeat="friend in friends.$filter(doFilter)">
        <td>{{friend.name}}</td>
        <td>{{friend.phone}}</td>
      <tr>
    </table>
</div>

CSS

.ng-invalid { border: 1px solid red; } 
body { font-family: Arial,Helvetica,sans-serif; }
body, td, th { font-size: 14px; margin: 0; }
table { border-collapse: separate; border-spacing: 2px; display: table; margin-bottom: 0; margin-top: 0; -moz-box-sizing: border-box; text-indent: 0; }
a:link, a:visited, a:hover { color: #5D6DB6; text-decoration: none; }
.error { color: red; }

JavaScript

function FilterCtrl() {
    var scope = this;
    var arr = [true,false,true];
    scope.result = arr;
    scope.doFilter = function(elem) { 
        if(!scope.searchText) return true;
        return angular.lowercase(elem.name).indexOf( angular.lowercase(scope.searchText)) == 0; 
    };
         
}