Question

我正在使用uib-datepicker-popup，我想更改按钮栏。现在，它分别使用.btn-info，.btn-danger和.btn-success作为“今天”，“清除”和“关闭”按钮。如何将这些更改为其他按钮类，例如.btn-default（希望没有多少工作）？

Answer 1

您可以修改日期选择器模板。默认值为：https://github.com/angular-ui/bootstrap/blob/master/template/datepickerPopup/popup.html

使用templateUrl指令，如下所示：

<input type="text" uib-datepicker-popup="MM/dd/yyyy" template-url="path/to/template.html" />

Answer 2

首先，您需要添加datepicker-popup-template-url属性

<input type="text" uib-datepicker-popup="MM/dd/yyyy" **datepicker-popup-template-url**="path/to/template.html" />

然后，您需要创建template.html

我添加了一个自定义按钮，设置日期为31/12/9999。模板在

下面

<ul class="uib-datepicker-popup dropdown-menu uib-position-measure" dropdown-nested ng-if="isOpen" style="left: 0px; top: 43px; display: block;"  ng-style="{top: position.top+'px', left: position.left+'px'}" ng-keydown="keydown($event)" ng-click="$event.stopPropagation()">
  <li ng-transclude></li>
  <li ng-if="showButtonBar" class="uib-button-bar">
    <span class="btn-group pull-left">
      <button type="button" class="btn btn-sm btn-info uib-datepicker-current" ng-click="select('today', $event)" ng-disabled="isDisabled('today')">{{ getText('current') }}</button>
      <button type="button" class="btn btn-sm btn-danger uib-clear" ng-click="select('31/12/9999', $event)">31/12/9999</button>
    </span>
    <button type="button" class="btn btn-sm btn-success pull-right uib-close" ng-click="close($event)">{{ getText('close') }}</button>
  </li>
</ul>

如何更改uib-datepicker-popup按钮栏？

2 个答案: