I have an application where I want to filter a long list of products based on value from "select" containing product types. The filter works, but only after I select something. It initially sets the "Show All" option, but filters out everything. If I select something else, it works, and if I re-select "Show All" it works. But why doesn't the filter work initially?

The model (looks something like this):

```
$scope.products = {[
    {name: 'productA',Type: 1},
    {name: 'productB',Type: 1},
    {name: 'productC',Type: 2},
    {name: 'productD',Type: 2},
]};

$scope.productTypes = {[
    {Name: 'typeAlpha',Type: 1},
    {Name: 'typeBravo',Type: 2},
]};

```

The HTML:

```
<select id="productFilter" data-ng-model="productFilter">
    <option value="" selected="selected">Show all</option>
    <option data-ng-repeat="type in productTypes" value="{{type.Type}}">{{type.Name}}</option>          
</select>
<p data-ng-repeat="product in products | filter:{Type:productFilter} ">{{product.Name}}</p>

```
['https://Stackoverflow.com/questions/35937244', 'https://Stackoverflow.com', 'https://Stackoverflow.com/users/4233688/']
I recommend using ng-options instead of ng-repeat over the options:

```
<select id="productFilter" ng-model="productFilter" 
  data-ng-options="type.type as type.name for type in productTypes">
    <option value selected="selected">Show all</option>
</select>
<p data-ng-repeat="product in products | filter:(!!productFilter || undefined) && {type: productFilter}">
    {{product.name}}
</p>

```

For "show all", the filter must return undefined ([ng-repeat filter "show all" items if no filter selected](https://stackoverflow.com/questions/28164580/ng-repeat-filter-show-all-items-if-no-filter-selected))

Also removed the {..} around the array and better use lower case for properties:

```
  $scope.products = [
    {name: 'productA', type: 1},
    {name: 'productB', type: 1},
    {name: 'productC', type: 2},
    {name: 'productD', type: 2}
  ];

  $scope.productTypes = [
    {name: 'typeAlpha', type: 1},
    {name: 'typeBravo', type: 2}
  ];

```

Here is a jsbin (based on Hiskinds)
<http://jsbin.com/yepaqikodo/1/edit?html,js,output>
you set $scope.productFilter = ''.
so its return by default value blank at filter.