【发布时间】：2014-08-29 22:37:53
【问题描述】：
我正在关注 AngularJS API 文档中“typeahead”的代码：http://angular-ui.github.io/bootstrap/
我可以通过按 Enter 来填充第一个选项的文本框，但由于某种原因，我无法使用箭头键（向上和向下）从自动完成列表中选择任何项目，但在他们的示例中， 我可以。
这可能是什么问题？
** 注意，这是一个 Express 项目，我使用的是 Jade 引擎。
头文件
link(rel='stylesheet', href='/css/bootstrap.css')
script(src='/js/jquery-2.1.1.min.js')
script(src='/js/angular.min.js')
script(src='/js/bootstrap.min.js')
script(src='/js/ui-bootstrap-tpls-0.11.0.min.js')
script(src='/js/index.js')
index.html 中的部分代码
<div ng-controller="TypeaheadCtrl" class="col-md-5 ng-scope">
<pre class="ng-binding">Model {{selected}}</pre>
<input type="text" ng-model="selected" placeholder="item name" typeahead="item for item in items | filter:$viewValue | limitTo:8" class="form-control" >
</div>
index.js
var App = angular.module('myApp', ['ui.bootstrap']);
function TypeaheadCtrl( $scope, $http ) {
$scope.selected = undefined;
$scope.items = ['Chicken', 'Corn', 'Ice Cream', 'Cereal'];
}
玩了一会儿之后，我发现我的浏览器还有另一个自动完成功能。可能是chrome自动填充？也许我的上下被用于此而不是被用于我的网络应用程序？如果是这样，您将如何通过代码禁用它，以便我可以仅在此页面上将其用于 Angular 的自动完成功能？
【问题讨论】：
-
我无法复制您的问题。如果您遇到问题，请使用此 plunk 并告诉我：plnkr.co/edit/imT6uvBqiP4IYKZtmuZs 使用此在您的浏览器中进行测试 run.plnkr.co/plunks/imT6uvBqiP4IYKZtmuZs 根据 ng-ui-bootstrap 文档，您不需要在代码中包含 bootstrap.js
-
它在 Plunker 中工作，但当我在笔记本电脑上本地托管它时它不起作用。并感谢您介绍引导文档！帮了我很多！
-
顺便说一句，我也在使用服务器端的 Jade 引擎。会不会也是这个问题？
-
我发现了问题，但仍然不清楚。和玉没有关系。我已经在常规设置中尝试过，但仍然没有得到任何亮点。我在调试器中注意到的是，在 Plunker 示例中，自动完成项（ul 的）的“类”在选择时被设置为活动，但对我来说，在本地不是。选项肯定会发生变化，但突出显示没有。所以我的上下工作正常，但突出显示没有。我仍然不知道为什么会这样。
-
@Dinesh 真正的问题是我使用的角度版本。我使用的是最新版本 1.3.0，它显然有问题，并且在活动索引和 ng-mouseenter 方面存在一些问题，因此没有将列表的索引设置为活动。我现在改用 1.2.19。不过感谢您的帮助。
标签： javascript jquery angularjs twitter-bootstrap autocomplete