ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

javascript – Angular:如何制作一个能够在点击时关闭UI引导下拉列表的元素

2019-05-27 19:24:02  阅读:267  来源: 互联网

标签:javascript angularjs angular-ui-bootstrap


我正在使用Angular UI与bootstrap,我正在使用uib-dropdown.我已将自动关闭设置为外部点击,但我还想在下拉菜单中创建一个关闭它的按钮.我尝试将uib-dropdown-toggle添加到其中一个元素但是完全打破了下拉(它根本不会打开).如何创建关闭下拉菜单的元素?
相关代码:

<div class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="btn-append-to-to-body">
  <ul class="list-unstyled">
    <!-- This is the button I want to close the dropdown -->
    <li><button type="button" class="btn btn-default">X</button></li>
    <li>...</li>
    <li>...</li>
  </ul>
</div>

解决方法:

只需使用is-open属性来控制with和angular变量下拉列表的“开放性”.然后,您可以以编程方式将此变量值设置为false以关闭下拉列表.

以下是您的代码中的示例:

<div class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="btn-append-to-to-body" is-open="dropdownIsOpen">
  <ul class="list-unstyled">
    <!-- This is the button I want to close the dropdown -->
    <li><button type="button" class="btn btn-default" ng-click="dropdownIsOpen = false">X</button></li>
    <li>...</li>
    <li>...</li>
  </ul>
</div>

标签:javascript,angularjs,angular-ui-bootstrap
来源: https://codeday.me/bug/20190527/1165360.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有