Angular UI: 下拉菜单不适用于日期选择器

Question

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

笨蛋: http://plnkr.co/edit/lBn3Oo?p=preview

Answer 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

Angular UI: 下拉菜单不适用于日期选择器

Angular UI: Dropdown not working with datepicker

datepicker

angularjs

angular-ui

angular-ui-bootstrap