title: AngularJS ng-repeat filter based on select option
body: <p>I am new to AngularJS. I am trying to filter the data set shown based on the option selected with a select box. </p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div ng-controller="CurrentTrandetailsController"&gt;
     &lt;div&gt;
        &lt;div class="pull-right"&gt;
           &lt;label for="show-filter" class="show-label"&gt;Show &lt;/label&gt;
           &lt;select name="show-filter" ng-model="searchText.accruedcard" id="show-filter" ng-options="trandetail.accruedcard as trandetail.accruedcard for trandetail in currentTrandetails.trandetails "&gt;
              &lt;option value=""&gt;All&lt;/option&gt;
           &lt;/select&gt;
        &lt;/div&gt;
        &lt;h3&gt;Current trandetails&lt;/h3&gt;
     &lt;/div&gt;
     &lt;div&gt;
        &lt;table class="table table-striped table-hover"&gt;
           &lt;tbody&gt;
              &lt;tr ng-repeat="trandetail in currentTrandetails.trandetails | filter:searchText"&gt;
                 &lt;td&gt;{{trandetail.dateAccrued}}&lt;/td&gt;
                 &lt;td&gt;{{trandetail.accruedcard}}&lt;/td&gt;
                 &lt;td&gt;{{trandetail.placeAccrued}}&lt;/td&gt;
                 &lt;td&gt;{{trandetail.discountcents}}&lt;/td&gt;
                 &lt;td&gt;{{trandetail.shortExpiryDate}}&lt;/td&gt;
              &lt;/tr&gt;
           &lt;/tbody&gt;
        &lt;/table&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I used the example given in <a href="http://docs.angularjs.org/api/ng.filter:filter" rel="nofollow noreferrer">http://docs.angularjs.org/api/ng.filter:filter</a>, which uses an input box to filter. On selecting a given card, it seems to filter fine. However, when I select "All", which has its value set to "", it doesn't display all the entries (clear the filter). However, in the example shown, when the text box is cleared, all the entries are displayed.</p>
  
  <p>What am I doing wrong?</p>