javascript - angular-ui bootstrap typeahead 转义键导致输入字段值变得未定义

Question

我在解决这个问题时遇到了问题，这似乎是一个边缘案例。当我从 typeahead 的下拉列表中选择(使用键盘或鼠标)一个值时，输入字段中的 ng-model 会被填充得很好。

但是，如果我输入几个字母然后点击“转义”按钮，“textFieldValue”ng-model 似乎被 typeahead 覆盖为“undefined”，因为我没有选择值。

解决这个问题的最佳方法是什么？还是边缘案例太多了？

<input type="text" ng-model="textFieldValue"
typeahead="list for list in getList($viewValue)" typeahead-editable="false">

Answer 1

您可以使用临时值来完成。

将临时值分配给 typeahead

<input type="text" ng-model="tempValue" typeahead="list for list in getList($viewValue) | filter:$viewValue" typeahead-editable="false" >

观察 tempValue 并决定是否更新目标值。

    $scope.$watch('tempValue', function(tempValue){
      if(shouldUpdateTheTargetValue(tempValue)) {
        $scope.targetValue = tempValue;   
      }
    });

我为此创建了一个 plunker。 - http://plnkr.co/edit/r63027iRobX4skV9YK60?p=preview