Фильтр сообщений по выбранной опции в angularjs

Question

<div class="ng_wrapper" 
data-ng-init="portfolios=[ 
{name: 'Portfolio 1', type: 'red'}, 
{name: 'Portfolio 2', type: 'red'}, 
{name: 'Portfolio 3', type: 'black'}, 
{name: 'Portfolio 4', type: 'black'} 
]">  
    <ul>    
     <li data-ng-repeat="portfolio in portfolios | filter:type "> 
     {{ portfolio.name | uppercase }} - [{{ portfolio.type | lowercase }}] 
     </li> 
    </ul> 
<select><option>red</option><option>black</option></select> 
</div> 

Как я могу фильтровать по типу с выбором? Когда я выбираю красный, я хочу отображать только красные портфели. Как я могу это сделать?

Благодаря

Answer 1

Вы можете добавить атрибут ng-model к Drop-down и сошлитесь же в filter из ng-repeat

<div class="ng_wrapper" data-ng-init="portfolios=[ 
{name: 'Portfolio 1', type: 'red'}, 
{name: 'Portfolio 2', type: 'red'}, 
{name: 'Portfolio 3', type: 'black'}, 
{name: 'Portfolio 4', type: 'black'} 
]"> 
    <ul> 
     <li data-ng-repeat="portfolio in portfolios | filter:portfolio_type "> 
     {{ portfolio.name | uppercase }} - [{{ portfolio.type | lowercase }}] 
     </li> 
    </ul> 
    <select ng-model="portfolio_type"> 
     <option>red</option> 
     <option>black</option> 
    </select> 
    </div> 

Работа демо: http://plnkr.co/edit/5md1XYgNhrxWUWW8CwDc?p=preview