Edit in JSFiddle

angular.module('app', [ ])
.controller('main', [ '$scope', '$http', '$interval', function($scope, $http, $interval) {
  $scope.fruits = [ 'apple', 'pear', 'plum' ];
}])
.filter('titleCase', function() {
  return function(input) {
    return (input == undefined || input === null) ? '' : input.replace(/_|-/, ' ').replace(/\w\S*/g, function(text){
      return text.charAt(0).toUpperCase() + text.substr(1).toLowerCase();
    });
  }
})
;

  <body ng-app="app">
    <div class="container" ng-controller="main">
      <div class="row">
        <div class="col-md-12">
          Here are {{ fruits.length }} fruits:
            <form class="navbar-form" role="search">
                <div class="input-group">
                    <input type="text" class="form-control" placeholder="Search" ng-model="search" />
                    <div class="input-group-btn">
                        <button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search"></i></button>
                    </div>
                </div>
            </form>
          <p>I'm searching by "{{ search }}"</p>
          <ul>
              <li ng-repeat="fruit in fruits | filter:search">
                {{ fruit | titleCase }} fruit
              </li>
          </ul>
        </div>
      </div>
    </div>  
  </body>