将所有值显示为焦点下拉

时间:2014-09-11 19:43:34

标签: angularjs angular-ui-bootstrap

这是我的代码。当我开始输入时,它会过滤列表。

我希望将所有值显示为输入文本焦点的下拉列表。

如果用户开始输入,那么我想要过滤。如果用户只关注并且没有输入任何内容,我想将所有值显示为下拉列表。

我该怎么做?

<script>
var app = angular.module('app', ['ui.bootstrap']);

app.controller('TypeaheadCtrl', function($scope, $http) {
  $scope.selected = undefined;
  $scope.states = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California', 'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii', 'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana', 'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota', 'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire', 'New Jersey', 'New Mexico', 'New York', 'North Dakota', 'North Carolina', 'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island', 'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont', 'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming'];
});

<h4>Search State</h4>
<pre>Model: {{selected | json}}</pre>
<input type="text" autocomplete="off" data-typeahead-editable="false" data-ng-model="selected" data-typeahead="state for state in states | filter:$viewValue | limitTo:8" class="form-control">

Plunker DEMO

1 个答案:

答案 0 :(得分:0)

目前此功能没有内置功能。<​​/ p>

但你可以解决这个问题。在这里阅读更多

Angular JS - Automatically focus input and show typeahead dropdown - ui.bootstrap.typeahead