title: Using input field for both default and user-defined filter with AngularJS
body: <p>There must be a simple answer to this, but I'm not getting it. I'm using the following input element to filter the results in a table through AngularJS. If I manually type "foo" into the input field, the table will filter for "foo". But my hard-coded value of "foo" (in the input's value attribute) will neither show up in the browser nor filter the results upon page load. How can I make this input field provide both a default filter and a user-defined filter? Thanks in advance.</p>
  
  <pre><code>&lt;input ng-model="search" id="search" type="text" placeholder="Search" value="foo"&gt;
  &lt;div ng-controller="eventsController")&gt;
      &lt;table&gt;
          &lt;tr ng-repeat="event in events | filter:search"&gt;
              &lt;td&gt;&lt;span ng-bind="event.title"&gt;&lt;/span&gt;&lt;/td&gt;
              &lt;td&gt;&lt;span ng-bind="event.date_start"&gt;&lt;/span&gt;&lt;/td&gt;
          &lt;/tr&gt;
      &lt;/table&gt;
  &lt;/div&gt;
  &lt;script&gt;
      function EventsController($scope, $http) {
          $http.get('/api/all-events').success(function(events) {
              $scope.events = events;
          });
      }
  &lt;/script&gt;
  </code></pre>