uib-typeahead不工作

Question

我正在使用来自https://angular-ui.github.io/bootstrap/的引用创建uib-typeahead。但是dropdown不会出现。我到处寻找，完全按照别人说的做，但下拉菜单没有出现。

html：

<div>
   <pre>Model: {{tc.selected | json}}</pre>
     <input type="text" ng-model="selected" uib-typeahead="state for state in states | filter:$viewValue | limitTo:8" class="form-control">
 </div>

js：

var myApp = angular.module("angularTypeahead", ["ui.bootstrap"]);

myApp.controller("TypeaheadCtrl", function($scope, States) {
    $scope.states = ["Alabama", "Alaska", "Arizona", "Arkansas", "California", "Colorado", "Connecticut", "Delaware", "Florida", "Georgia", "Hawaii", "Idaho", "Illinois"];

});

这里是柱塞：https://plnkr.co/edit/qQAGX7u6JJursmItfrf6?p=preview

请告诉我哪里出错了

Answer 1

首先，你有一个带有不正确状态的DI：

myApp.controller("TypeaheadCtrl", function($scope, States)

应该是：

myApp.controller("TypeaheadCtrl", function($scope)

其次，您是否计划使用旧版本的Angular和UI bootstrap？这个可以工作，但它是在最新版本的uib和angular上运行的：https://plnkr.co/edit/hQwGKnzLOU0veR6TSnwg?p=preview

Answer 2

使用typeahead而不是uib-typeahead。如果您确实需要使用uib-typeahead，请检查angular-bootstrap-ui的版本。应该大于0.14。

如果要迁移到较新的版本，请查看所需的更改：https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.3.3/ui-bootstrap-tpls.js