Bootstrap Search dropdown

HTML

<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/css/bootstrap-combined.min.css">
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js"></script>
<div class="navbar navbar-inverse" ng:controller="Ctrl">
    <div class="navbar-inner">
        <div class="container">
            <a class="brand">Title</a>
            
            
            
            <div class="form-search pull-right navbar-search">
                <div class="input-prepend">
                   
                  <ul class="dropdown-menu">
                      <li ng:repeat='item in list'><a ng:click='$parent.selected = item' href="#">{{item.name}}</a></li>
                  </ul>
                  <input class="input-big search-query" type='search' />
                </div>
            </div>
            
        </div>
    </div>
</div>

CSS

.navbar-search .dropdown-menu a {
    font-size: 14px;
}

CoffeeScript

class Ctrl
  @$inject: ['$scope']
  constructor: (scope) ->
    scope.list = [
      name: 'Last.FM'
      prefix: 'Last.FM'
    ,
      name: 'VKontakte'
      prefix: 'VK'
    ,
      name: 'Hype Machine'
      prefix: 'Hypem'
    ]
    
    scope.selected = scope.list[0]
    @



app = angular.module 'app', []

app.controller 'Ctrl', Ctrl

angular.bootstrap document, ['app']