невозможно выбрать имя из списка автозаполнения

Question

Я показываю список автозаполнения для текстовых полей.

Когда пользователь вводит какой-либо символ в textbox, он показывает список автозаполнения, из которого пользователь может выбрать имя, но если пользователь не хочетчтобы выбрать любое имя из списка автозаполнения и щелкнуть за пределами списка, список автозаполнения исчезнет, ​​и код для этого будет таким, как показано ниже:

#country1:not(:focus)+.list-group {
  display: none;
}

Но мой рабочий функционал сломался, и он не позволяет выбратьимя из списка автозаполнения в любом из текстовых полей.

Демонстрация: http://plnkr.co/edit/y4UNoYtuJFYhjpN0mtWS?p=preview

CSS:

#country1:not(:focus)+.list-group {
  display: none;
}

#country2:not(:focus)+.list-group {
  display: none;
}

#country3:not(:focus)+.list-group {
  display: none;
}

Answer 1

Если я правильно понял:

• И добавить в полный метод () значение поля в список

• Используйте ng-mousedown вместо ng-click (чтобы щелчок выполнялся до потери фокуса)

   $scope.complete = function (string, labelSel) {
          var output = [];
  
          if(string !== "")
            output.push(string); // push your string at first 
  
          angular.forEach($scope.countryList, function (country) {
              if (country.toLowerCase().indexOf(string.toLowerCase()) >= 0) {
                  output.push(country);
              }
          });
          //... etc
    }
  

http://next.plnkr.co/edit/rlYx5oXTqbfBloid5Jue?p=preview