uib-datepicker : 在表格中使用时显示问题

Question

我想在表格中使用 uib-datepicker：

<div class="table-responsive">
    <table class="table table-striped"  >
        <thead>
            <tr>
                <th class="col-md-2"><span>Date</span></th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="materiel in vm.chantier.listeMateriels track by materiel.id">
                <td class="col-md-2">
                    <div class="input-group">
                        <input type="text" class="form-control" datepicker-popup="{{vm.formatDate}}"uib-datepicker-popup ng-model="materiel.date"
                               is-open="materiel.isOpen" ng-change="vm.dateDebutChanged()"  />
                        <span class="input-group-btn">
                            <button type="button" class="btn btn-default" ng-click="vm.openCalendarMateriel($event, materiel)">
                                <i class="glyphicon glyphicon-calendar"></i></button>
                        </span>
                    </div>
                </td>                
            </tr>
        </tbody>
    </table>
</div>

但这是我得到的： 点击前：

点击后：

日历似乎被表格边框截断，我希望它出现在我的表格上方

Answer 1

从您的父 div 中删除 class="table-responsive"：它会截断日期选择器。

Demo on JSFiddle