Angular Bootstrap Typeahead dropdown

我有一個角度ui-boostrap typeahead組件，它正在正常工作，直到我向整個函數添加一個要求。我想在用戶輸入3個字母后，爲後面的結果調用建議的結果。它正確完成，但我的問題是，只有當用戶輸入第四個字母時，結果纔可見。有沒有什麼辦法可以繞過這個，只需在用戶輸入第三個字母后強迫它刷新UI。代碼是：Angular Bootstrap Typeahead dropdown

HTLM 
<input name="states" id="states" type="text" ng-model="vm.cityName" 
uib-typeahead="municipality as municipality.city + ' (' + municipality.name + ') '+municipality.zipCode for municipality in vm.getMunicipalitiesByCity($viewValue) | filter:$viewValue | limitTo:8" class="form-control" typeahead-on-select="vm.citySelected()" > 

JS Controller 
vm.getMunicipalitiesByCity = function (cityName) { 
      if (cityName != undefined && cityName.length == 3) { 
       CalculationEndpointService.municipalitiesByCity({cityName: cityName}, function (result) { 
        vm.municipalities = result.map(
         function (item) { 
          return item; 
         } 
        ); 
       }); 
      } 
      if(cityName.length<3){ 
       vm.municipalities=[""]; 
      } 
      return vm.municipalities; 
     };

來源

2016-07-28 Igor Gazivoda