In the fiddle shared in the comments, it's demonstrated that a dropdown functions similarly to a regular list, with different styling. While Bootstrap is used in this example for the dropdown, there are numerous other examples available through a simple search online.
Live demonstration: https://jsfiddle.net/jorgthuijls/6gvp2z9h/
Below is the complete view:
<div ng-controller="MyCtrl">
city: <input type="text" ng-model="search.city">
<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
Dropdown
<span class="caret"></span>
</button>
<ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
<!-- the 'search' bit in the filter maps to the 'search' variable on $scope -->
<li ng-repeat="user in users | filter:search:strict">{{user.name}}, {{user.city}}</li>
</ul>
</div>
</div>
The controller code is relatively concise as well:
var myApp = angular.module('myApp', []);
function MyCtrl($scope) {
$scope.search = {};
$scope.search.city = 'new york';
$scope.users = [{
name: 'bob',
city: 'hong kong'
}, {
name: 'jack',
city: 'new york'
}, {
name: 'john',
city: 'new hampshire'
}]
}