UI-SELECT 鼠标选择不适用于 tagging-label=false

Question

在 Angular ui-select 中使用tagging-label='false'时，无法通过鼠标单击进行选择。我使用版本 angular-ui-select - 0.13.2、0.14.1 和最新的 0.14.9 进行了测试。我的要求是我可以通过键盘（如文本框）输入任何值，并且我可以使用鼠标从下拉列表中选择任何现有选项。

 <ui-select tagging="newTag" tagging-label="false" ng-model="selectedCountry" theme="bootstrap" style="width: 300px;" title="Choose a country">
      <ui-select-match placeholder="Select country...">{{$select.selected}}</ui-select-match>
      <ui-select-choices repeat="country in countries | filter:$select.search">
      {{country}}
      </ui-select-choices>
 </ui-select>

这是 Plnkr - http://plnkr.co/edit/UGbBq1fSMZK12tpa2wK5?p=preview

Answer 1

我认为问题出在 tagging="newTag" 属性中，该属性需要定义一个$scope.newtag()函数（但控制器中缺少它）。

它可以更改代码，如下所示：

  <ui-select ng-model="model.selectedCountry" tagging-label="false" theme="bootstrap" ng-disabled="disabled" style="width: 300px;" title="Choose a country">
    <ui-select-match placeholder="Select country...">{{$select.selected}}</ui-select-match>
    <ui-select-choices repeat="country in countries | filter:$select.search">
      {{country}}
    </ui-select-choices>
  </ui-select>

另一件事是，由于 Angular/JS 中的范围继承，有必要将selectedCountry包装在对象中（所有 ui-select 示例都使用这种方式）：

 $scope.model = {selectedCountry: ''};

PLNKR更新：

http://plnkr.co/edit/wqyTifycfTmnnsn22Be9?p=preview