Angularjs 在angular js datepicker指令中仅隐藏清除按钮

Angularjs 在angular js datepicker指令中仅隐藏清除按钮,angularjs,angularjs-directive,datepicker,angular-ui-bootstrap,Angularjs,Angularjs Directive,Datepicker,Angular Ui Bootstrap,我只想在angular js中隐藏datepicker指令中的clear按钮。 目前,angular js datePicker指令的底部有三个按钮(今天,clear and Close),是否有任何方法可以配置这些按钮的可见性,以便我可以隐藏其中一个按钮 我正在使用的日期选择器正在使用ui引导库。目前,可以通过指令上的选项隐藏日期选择器按钮栏中的各个按钮。您可以覆盖模板并删除“清除”按钮,但这是一个全局修补程序,不提供基于条件的隐藏/显示。您可以创建一个类,该类以要隐藏的按钮为目标,如下所示

我只想在angular js中隐藏datepicker指令中的clear按钮。 目前,angular js datePicker指令的底部有三个按钮(今天,clear and Close),是否有任何方法可以配置这些按钮的可见性,以便我可以隐藏其中一个按钮


我正在使用的日期选择器正在使用ui引导库。

目前,可以通过指令上的选项隐藏日期选择器按钮栏中的各个按钮。您可以覆盖模板并删除“清除”按钮,但这是一个全局修补程序,不提供基于条件的隐藏/显示。您可以创建一个类,该类以要隐藏的按钮为目标,如下所示

尽管这是一个脆弱的解决方法,但它仍然可以证明


我建议提交一个功能请求,以添加按钮栏中可用按钮的选项。

对于Rob J的解决方案,如果我们向datepicker输入的父div添加一个ng类={“require”:“vm.required”},或者简单地向div添加一个名为require的类。然后根据vm.required的值,使用神奇的css隐藏或显示clear按钮:

.require button[ng-click^="select(null)"] {
    display: none;
}

简单,替换模板:

<script type="text/ng-template" id="template/datepicker/popup.html">
    <ul class="dropdown-menu" ng-if="isOpen" style="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" style="padding:10px 9px 2px">
            <span class="btn-group pull-left">
            <button type="button" class="btn btn-sm btn-info" ng-click="select('today')" ng-disabled="isDisabled('today')">{{ getText('current') }}</button>
            </span>
            <button type="button" class="btn btn-sm btn-success pull-right" ng-click="close()">{{ getText('close') }}</button>
        </li>
    </ul>
</script>

  • {{getText('current')} {{getText('close')}

您可以使用css进行黑客攻击。这对我有用

.ui-datepicker .btn-group .btn-danger.btn{
    display: none;
}

如果您想删除clear按钮,这意味着该字段是必需的,而且我不同意强制执行某些操作(例如创建div父项和键入类),那么只需根据需要设置激活日期选择器的元素即可

[uib日期选取器弹出窗口][必需]+[uib日期选取器弹出窗口包装]按钮[ng单击*=“选择(空)”]{
显示:无;
}

您可以使用css技巧隐藏清除按钮:

.uib-button-bar > .btn-group > .btn-danger {
    display: none !important;
}

您可以通过向style.css添加以下内容来隐藏它:

.uib-clear {
    display: none;
}

你能给我们一些屏幕截图吗?还有,你尝试过什么?如果你能在中提供你的案例演示,比如plnkr.co沙盒,可以让观众更容易地帮助你。我同意通过css实现这一点的答案。没有其他快速解决方法或现成的选项来删除此按钮。因此ay(css)或者更复杂的方法是修改模板文件,这对于企业应用程序或使用bower的应用程序来说并不总是可能的。我不明白当清除按钮被简单地删除时,您所指的字段是什么意思?我在许多应用程序上使用了日期选择器,并且在一些应用程序上删除了清除按钮,在其他应用程序上删除了所有按钮,例如tc,而且从来没有-一次-它与它是一个必填字段有任何关系…如果我显得粗鲁,我道歉,但我不认为你的帖子回答了这个问题,并且完全无关。
.uib-clear {
    display: none;
}