【问题标题】:Angular UI: Dropdown not working with datepickerAngular UI:下拉列表不适用于日期选择器
【发布时间】:2015-10-14 12:36:23
【问题描述】:

我正在尝试在下拉列表中添加 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>

Plunkerhttp://plnkr.co/edit/lBn3Oo?p=preview

【问题讨论】:

  • 您要针对此日期选择器的输入在哪里?

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


【解决方案1】:

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

<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

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-11-20
    • 2015-10-13
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多