Angular Typeahead指令 - 访问匹配元素

How can i get the first element suggested by the Angular Typeahead to appear in the inputbox, instead of just in the dropdown? I've searched, but i cant seem to find how to access the elements shown in the dropdown. The idea is that the suggestion comes as a background text whenever the user has started typing, as you can see in the typeahead.js example

如何让Angular Typeahead建议的第一个元素出现在输入框中，而不是仅仅在下拉列表中？我搜索过，但我似乎无法找到如何访问下拉列表中显示的元素。这个想法是，无论何时用户开始输入，该建议都会作为背景文本出现，您可以在typeahead.js示例中看到

<input type="text" ng-model="selected" typeahead-min-length="0" typeahead="state for state in states | filter:$viewValue | limitTo:8" class="form-control"> <!--Here i want the first suggestion -->

Plunker: http://plnkr.co/edit/nQYm83onnkUHa5tUFCk6?p=preview

Plunker：http：//plnkr.co/edit/nQYm83onnkUHa5tUFCk6？p =preview

Not even a simple {{ matches[0] }} will give the element.

即使是简单的{{matches [0]}}也不会给出元素。

2 个解决方案

#1

I think you want something like this:

我想你想要这样的东西：

<html ng-app="plunker">

<head>
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.js"></script>
  <script src="http://angular-ui.github.com/bootstrap/ui-bootstrap-tpls-0.6.0.js"></script>
  <script src="example.js"></script>
  <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet">
</head>

<body>

  <alert type="'info'">Typeahead from <a href="http://angular-ui.github.com/bootstrap/">http://angular-ui.github.com/bootstrap/</a>"</alert>
  <div class='container-fluid' ng-controller="TypeaheadCtrl">
    <pre>Mod: {{result}}</pre>
    <pre>Res: {{citiesList.list[0]}}</pre>
    <input type="text" ng-model="result"
        typeahead="suggestion for suggestion in (citiesList.list= cities($viewValue)) | filter: { name: $viewValue }"
        typeahead-editable="false"
        typeahead-min-length="3"
        typeahead-wait-ms="500"
        typeahead-append-to-body="true"
        typeahead-on-select='citiesList.list[0] = $item'
        >
  </div>
</body>

</html>

Plunker

Could somebody improve this variant?

有人可以改进这种变体吗？

#2

If i understood correct , you want to show first value of states array in placeholder if yes then Try this : <input type="text" placeholder ="{{states[0]}}" ng-model="selected" typeahead-min-length="0" typeahead="state for state in states | filter:$viewValue | limitTo:8" class="form-control">

如果我理解正确，你想在占位符中显示状态数组的第一个值，如果是，那么试试这个：

#1