angularjs - Angular 用户界面 : Dropdown not working with datepicker

标签 angularjs datepicker angular-ui angular-ui-bootstrap

我试图在下拉列表中添加日期选择器,如下所示,并设置 autoClose="outsideClick"。但是,当按下任何月份按钮时,它会切换下拉菜单。怎么解决这个问题?

HTML 代码:

<div class="date-wrap pull-right" dropdown auto-close="outsideClick">
                <button class="btn btn-info" dropdown-toggle>Date Picker</button>
                <div class="dropdown-menu  datepicker" role="menu">
                        <datepicker show-weeks="false" ng-model="dt"></datepicker>
                </div>
</div>

骗子:http://plnkr.co/edit/lBn3Oo?p=preview

最佳答案

您需要手动防止点击事件冒泡,因此它永远不会到达关闭下拉列表的最顶层节点(文档):

<div class="date-wrap pull-right" dropdown auto-close="outsideClick">
    <button class="btn btn-info" dropdown-toggle>Date Picker</button>
    <div class="dropdown-menu  datepicker" role="menu" ng-click="$event.stopPropagation()">
        <datepicker show-weeks="false" ng-model="dt"></datepicker>
    </div>
</div>

请注意,ng-click="$event.stopPropagation()" 就可以实现这一点。

演示: http://plnkr.co/edit/pPwW83Ro0u0g4dVhyZaZ?p=info

关于angularjs - Angular 用户界面 : Dropdown not working with datepicker,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33125500/

相关文章:

javascript - 在 `$scope.eventSource` 上,属性 `className` 不相加 - 问题

angularjs - Angular Schematics - 在树上应用数以千计的更改导致错误超出最大调用堆栈大小

java - 在 Fragment 中设置 onClickListener 时出现 NullPointerException

javascript - 使用 Angular 从元素数组创建单选按钮列表

iPhone 更新日期弹出窗口?

javascript - jQuery 日期选择器在 IE 中不起作用

angularjs - <select> 带有 Angular/ Bootstrap 的占位符不起作用

javascript - 如何在 javascript 中检查日期是否是星期一

javascript - 如何将对象发送到复选框上的 Angular Directive(指令)

javascript - $watch 不会触发带有美元 ($) 的变量