22

注意：您可以在本文中找到答案：Remove footer from angular ui bootstrap date picker

我正在使用 ui-bootstrap datapicket 作为出生日期字段。如下

<input type="text" data-datepicker-popup="dd-MMMM-yyyy" data-show-weeks="false" data-ng-model="model.dateOfBirth" id="dateOfbirth" name="dateOfBirth">

它工作正常。如下所示

在此处输入图像描述

所以我的问题是如何隐藏日期选择器的页脚？

提前致谢..

4

5 回答 5

46

您可以在全局范围内执行此操作，如下所示：

myApp.config(function (datepickerConfig, datepickerPopupConfig) {
    // datepickerConfig.showWeeks = false;
    // datepickerPopupConfig.toggleWeeksText = null;
    datepickerPopupConfig.showButtonBar = false;
});

或者您可以为日期选择器的特定实例执行此操作，如下所示：

<input type="text" ng-model="dt" show-button-bar="false" />
于 2014-03-18T07:04:24.203 回答
6

寻找相同的，我找到了这个答案：

从 Angular-ui 引导日期选择器中删除周列和按钮

所以：

angular.module('app', ['ui.bootstrap'])
  .config(function (datepickerConfig) {
      datepickerPopupConfig.showButtonBar = false;
    });
于 2014-02-24T18:21:51.560 回答
2

如果您下载“ui-bootstrap-tpls-[version].min.js”文件，则该指令的模板包含在 JS 中。

修改缩小版可能很困难，因此您可能需要查看未缩小版。

但基本上你正在寻找找到的 HTML 代码 @ https://github.com/angular-ui/bootstrap/blob/master/template/datepicker/popup.html

一旦你在你的 JS 文件中找到那个位，就可以随意修改它。

于 2013-09-26T14:38:32.160 回答
1

它悄悄地是一个糟糕的解决方案，但我没有在文档中看到可能的解决方案。您可以通过这种方式使用 CSS 隐藏它们：

[ng-controller="DatepickerDemoCtrl"] > hr ~ button { display:none }

当您还想隐藏<hr>：

[ng-controller="DatepickerDemoCtrl"] > hr { display:none }

将DatepickerDemoCtrl替换为您的控制器。

于 2013-09-26T14:35:15.027 回答
0

你的问题很简单。您可以在角度引导模块中修改 datepickerPopupWrap 指令。您可以找到一个 templateUrl 字段。像这样的东西

模板网址：模板/日期选择器/popup.html，

只需用模板替换该字段：

        ^<ul class=\^dropdown-menu\^ ng-style=\^{display: (isOpen && 'block') || 'none', top: position.top+'px', left: position.left+'px'}\^ class=\^dropdown-menu\^>\n^ +
        ^   <li ng-transclude></li>\n^ +
        ^</ul>^,

注意：将 ^ 替换为 " 。由于 stackoverflow 将其作为块引用，因此我使用了 ^。

模板字段定义如何在浏览器中显示输出。您甚至可以包含自己的元素并根据需要进行修改。

于 2013-10-14T13:42:42.717 回答