使用Angular-ui Bootstrap设置typeahead的选项

ktm*_*ktm 6 typeahead angularjs angular-ui-bootstrap

使用typeahead,我试图设置几个选项,它们可用作标准的Bootstrap typeahead选项

使用下面的代码,我可以通过将其设置为"typeahead-min-length"来设置"minLength"属性,但是对"item"作为"typeahead-items"执行相同操作则不行.有没有不同/更好/标准的方法来做到这一点?有没有办法将一系列选项附加到$ scope?

<div class='container-fluid' ng-controller="TestController">

<input type="text" ng-model="selected" 
typeahead="foo for foo in foo | filter:$viewValue" typeahead-items='5' typeahead-min-length='3'>

<pre>{{selected| json}}</pre>  </div>
Run Code Online (Sandbox Code Playgroud)

更新:我试图坚持使用AngularJS,而不是使用jQuery

这是我的控制器:

  myAppModule.controller('TestController', function($http,$scope) {
  $scope.selected = undefined;

  $http.get('data/sample.json')
       .then(function(results){
          $scope.foo = results.data; 
      });
  });
Run Code Online (Sandbox Code Playgroud)

Hie*_*yen 7

为什么不使用JS方式初始化typeahead:

$('input.typeahead').typeahead({
    source: array_of_value_here,
    minLength: 1,
    items: 5,
    // your option values ...
});
Run Code Online (Sandbox Code Playgroud)

编辑:

我看,AngularJS方式,你可以使用limitTo:

<input type="text" ng-model="selected" typeahead="foo for foo in foo | filter:$viewValue | limitTo:5" typeahead-min-length='3'>
Run Code Online (Sandbox Code Playgroud)