angularui bootstrap typeahead-预填充下拉列表onfocus答案

【问题标题】：angularui bootstrap typeahead- prepopulate dropdown list onfocusangularui bootstrap typeahead-预填充下拉列表onfocus
【发布时间】：2015-05-14 04:58:31
【问题描述】：

我正在为我的项目使用 angularui bootstrap typeahead 模块。

我无法使用预定义的值预先填充下拉列表。
每当用户单击预先输入的输入文本时，它应该自动显示预先输入建议下拉菜单（来自静态 JSON）。

当用户开始输入时，行为应该是正常的。

我尝试了this 解决方案，但不幸的是，当我将我的 angularjs 升级到版本 1.3 时它停止工作

【问题讨论】：

标签： angularjs angular-ui-bootstrap angular-ui-typeahead

【解决方案1】：

所以我基本上是通过制作一个自定义指令并对 ui 引导预输入代码进行微小修改来实现这一点的。你必须欺骗预先输入的人认为有人在其中输入了一些东西。我在该字段的右侧放置了一个小下拉箭头，因此基本上它看起来像一个下拉菜单，单击该箭头将显示所有选项。您应该可以使用 onfocus 做到这一点。
基本上在 bootstrap typeahead 中找到绑定到键事件的代码，我将其更改为检查 40 的 keydown 事件

           if(scope.matches.length === 0 && evt.which === 40) {  // Added            
         //   COMMENT OUT  modelCtrl.$setViewValue(modelCtrl.$viewValue);
                          modelCtrl.$setViewValue('');  // Added
            }

您还需要确保 typeaheadMinLength 设置为 0。请注意，在上面的代码中，它会检查用户没有输入任何内容以及我触发的特殊 keydown 事件的情况。您应该能够将其更改为在 onfocus 上触发。我将 bootstrap typeahead 复制到 mytypeahead.js 中，然后按上述方式对其进行了修改，以及您可能需要或不需要的其他一些次要模块，具体取决于该字段是否“必需”。

【讨论】：