angularjs – Angular UI：下拉列表不能与datepicker一起使用

发布时间：2020-12-17 17:21:23 所属栏目：安全来源：网络整理

导读：我试图在下拉列表中添加Datepicker,如下所示,并设置autoClose =“outsideClick”.但是,当按下任何月份按钮时,它会切换下拉列表.怎么解决这个？ Html代码： div class="date-wrap pull-right" dropdown auto-close="outsideClick" button class="btn btn-info

我试图在下拉列表中添加Datepicker,如下所示,并设置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>

Plunker：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

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!