在创建范围angularjs的指令中访问和操作变量

Question

我在AngularJS中有一个控制器，该视图的目标是创建一个自动完成下拉列表。我在功能上有一些问题。我开始输入内容，选项显示在输入下方，但我想单击其中之一，然后更改输入值，并删除建议列表。目前，这还没有发生。

这是我的控制者：

$http.get(API_URL + "get/cities")
    .then(function (response) {
            $scope.cities = response.data;
        },
        function () {
            console.log('error');
        });

$scope.selectCity = function (cityId, name) {
    $scope.citySearch = name;
    $scope.showCityList = false;
};

这是视图：

<div class="row">
    <div class="col-xs-12">
        <div class="form-group">
            <input type="text" ng-model="citySearch" ng-change="showCityList = true" class="form-control input-lg" placeholder="Град">
            <ul ng-if="citySearch.length > 0 && showCityList" class="list-group">
                <li ng-repeat="city in cities | filter: citySearch | orderBy:'name'" class="list-group-item" ng-click="selectCity(city.id, city.name)">@{{ city.name }}</li>
            </ul>
        </div>
    </div>
</div>

我应该提到，此HTML代码位于ng-switch-when内。