Angular UI 引导程序 - 在 typeahead-no-results 上显示下拉列表 [英] Angular UI bootstrap - show dropdown on typeahead-no-results
问题描述
尝试在输入前没有结果时获得下拉菜单,但下拉菜单不显示查看
<div class="form-group"><input placeholder="Vælg kunde" type="text" ng-model="customer" typeahead-editable="false" uib-typeahead="customer as customer.customer for customer in customers | filter:$viewValue | limitTo:8"类=表单控件"typeahead-popup-template-url="customPopupTemplate.html"typeahead-min-length="0"typeahead-no-results="noResults"><div ng-if="noResults" 下拉切换><ul class="下拉菜单" ><li><a href="#">没有结果</a></li>
删除 class="dropdown-menu" 给了我没有结果的 li,但我不把它作为下拉菜单
如果没有结果,我该给谁切换这个下拉菜单?
问题是下拉菜单永远不会被触发,因此没有正确呈现.您只是使标记可见.
您可以设置 auto-close="disabled"
和 is-open="true"
以在 noResults
上正确显示下拉列表:
<input placeholder="Vælg kunde" type="text" ng-model="customer" typeahead-editable="false" uib-typeahead="state for state in states | filter:$viewValue | limitTo:8" class="form-control" typeahead-min-length="0" typeahead-no-results="noResults"><span ng-if="noResults" auto-close="disabled" is-open="true" uib-dropdown uib-dropdown-toggle><ul class="uib-dropdown-menu" ><li><a href>没有结果</a></li></span>
工作演示 -> http://plnkr.co/edit/4vVznXyjZo3HuIb2p5as?p=预览
注意:plnkr 使用 ui-bootstrap 版本 0.14.3,如果您使用的是 0.14.0 之前的版本,则不要附加 uib-
前缀.
tryng to get a dropdown when no result on typeahead but, the drop down menu dosen't show view
<div class="dropdown">
<div class="form-group">
<input placeholder="Vælg kunde" type="text" ng-model="customer" typeahead-editable="false" uib-typeahead="customer as customer.customer for customer in customers | filter:$viewValue | limitTo:8" class="form-control"
typeahead-popup-template-url="customPopupTemplate.html"
typeahead-min-length="0"
typeahead-no-results="noResults">
</div>
<div ng-if="noResults" dropdown-toggle>
<ul class="dropdown-menu" >
<li><a href="#">No result</a></li>
</ul>
</div>
</div>
removing class="dropdown-menu" gives me the li with no result, but i dont get it as a dropdown menu
who do i toggle this dropdown menu on no result ?
The problem is that the dropdown never is triggered, and by that not rendered properly. You are just making the markup visible.
You can set auto-close="disabled"
and is-open="true"
to show the dropdown properly upon noResults
:
<div class="form-group">
<input placeholder="Vælg kunde" type="text" ng-model="customer" typeahead-editable="false" uib-typeahead="state for state in states | filter:$viewValue | limitTo:8" class="form-control" typeahead-min-length="0" typeahead-no-results="noResults">
<span ng-if="noResults" auto-close="disabled" is-open="true" uib-dropdown uib-dropdown-toggle>
<ul class="uib-dropdown-menu" >
<li><a href>no results</a></li>
</ul>
</span>
</div>
working demo -> http://plnkr.co/edit/4vVznXyjZo3HuIb2p5as?p=preview
NB: The plnkr is using ui-bootstrap version 0.14.3, if you are using a version prior to 0.14.0 then do not append uib-
prefixes.
这篇关于Angular UI 引导程序 - 在 typeahead-no-results 上显示下拉列表的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!