使用对象名称预先输入答案

【问题标题】：Typeahead using object name使用对象名称预先输入
【发布时间】：2013-04-15 14:17:45
【问题描述】：

我正在尝试使用AngularJS 和UI Bootstrap 设置typeahead，如下所示：

.html

<input type="text" ng-model="selectedStuff" typeahead="stuff.name for stuff in stuffs | filter:$viewValue"/>

<span>{{selectedStuff.name}}</span>
<span>{{selectedStuff.desc}}</span>

.js

$scope.stuffs= [
                {
                 "name":"thing1",
                 "desc":"this is the first thing"
                },
                {
                 "name":"thing2",
                 "desc":"this is the second thing"
                }
               ]

目前，我已经能够使用所选名称更新模型，但我的目标是通过 typeahead 传递整个对象。有没有一种只使用输入的干净方法？

【问题讨论】：

标签： angularjs bootstrap-typeahead angular-ui-bootstrap

【解决方案1】：

当然:-)

http://angular-ui.github.io/bootstrap/ 中的 typeahead 指令使用与 ng-options 的 AngularJS select directive 相同的超灵活语法。所以你可以写：

typeahead="stuff as stuff.name for stuff in stuffs | filter:$viewValue"

这是一个有效的 plunk：http://plnkr.co/edit/5kGZkNPZ7rIFfb4Rvxej?p=preview

【讨论】：

太棒了！就像我希望的那样简单而令人敬畏。谢谢！
我在输入框中看到“[Object object]”，因为我必须在控制器中实例化它才能在控制器中使用它。如果我不实例化它，并且它一开始是未定义的，那么它显示得很好。这是我的困境。有什么想法吗？
我遇到了同样的错误。点击后出现object对象，morgs32你解决了吗？
做这样的事情typeahead="item.ItemID for item in items_vendors.items | filter:$viewValue | limitTo:8" 帮助了我，ItemID 是我想要显示的内容。

【解决方案2】：

我遇到了同样的问题。我已经解决了

typeahead="country.name for country in countryList | filter:$viewValue | limitTo:8"

这里的 countryList 是国家对象的列表。名称是国家对象的属性之一。对我来说它工作正常。

【讨论】：