【问题标题】:Remove week column and button from Angular-ui bootstrap datepicker从 Angular-ui 引导日期选择器中删除周列和按钮
【发布时间】:2014-01-07 19:17:34
【问题描述】:

我正在使用angular-ui bootstrap datepicker。现在我需要从 datepicker 中删除 #(week) 列和 week 按钮。我的应用程序的多种形式都使用了这个日期选择器。我想从所有这些中删除周列。

为此,我已经全局配置了 datepickerConfig (show-weeks),但它仍然无法正常工作。任何人都可以让我知道我做错了吗?

【问题讨论】:

    标签: angularjs datepicker angular-ui-bootstrap


    【解决方案1】:

    请看这个例子:http://plnkr.co/edit/6i4G7JkvBiWXZYlrV2GL?p=preview

    angular.module('app', ['ui.bootstrap'])
      .config(function (datepickerConfig) {
          datepickerConfig.showWeeks = false;
        });
    

    【讨论】:

    • 谢谢它的工作。你知道如何从底部隐藏只有几周的按钮吗?
    • 我查看了 datepickerPopup 的源代码,没有办法做到这一点。您可以使用肮脏的 hack 和隐藏按钮与 css 代替,像这样:plnkr.co/edit/6i4G7JkvBiWXZYlrV2GL?p=preview ... 但这是一个非常肮脏的 hack %)
    • 谢谢,我没问题。
    【解决方案2】:

    对于弹出窗口中的 datepicker,datepicker-options 属性的值 dateOptions 可以为任何 datepicker 设置添加 json,如下面的 HTML 所示。

    <input type="text" class="form-control" datepicker-popup="{{format}}" ng-model="dt" is-open="opened" min-date="minDate" max-date="'2015-06-22'" **datepicker-options="dateOptions"** date-disabled="disabled(date, mode)" ng-required="true" close-text="Close" />
    

    在 javascript 中这是给出的

     $scope.dateOptions = {
        formatYear: 'yy',
        startingDay: 1,
        
      };
    

    只需像这样在 dateOptions 中添加 showWeeks:false,

     $scope.dateOptions = {
        formatYear: 'yy',
        startingDay: 1,
        showWeeks:false
      };
    

    或者你可以像这样添加 'show-weeks':'false' 。 演示显示在 plunker [http://plnkr.co/edit/qbp3IObj13op2RS17IEg?p=preview][1]

    【讨论】:

    • 这应该是公认的答案,因为它只删除此日期选择器中的星期,而不是应用程序中的所有日期选择器。
    • 感谢您的回答,我认为这是一个比已接受的答案更清洁的解决方案,但是 showWeeks:'false' 对我不起作用。我必须删除单引号,然后它才起作用。
    • Angular 1.5.6 我还必须删除单引号才能使其工作。
    • 感谢您的帮助,但是没有单引号的解决方案是可行的。因此,showWeeks:false 可以代替 showWeeks:'false'。
    【解决方案3】:

    如果 angular bootstrap ui 版本为 0.14.3,请使用以下

    app.config(function (uibDatepickerConfig) {
        uibDatepickerConfig.showWeeks = false;
        uibDatepickerConfig.showButtonBar = false;
    });
    

    【讨论】:

    • showButtonBar 在 PopupConfig 中设置:uibDatepickerPopupConfig.showButtonBar = false;
    【解决方案4】:

    如果您想直接在模板中进行,只需在输入中添加以下属性:show-weeks="false"

    【讨论】:

    • 我一直在尝试使用 show-weeks 属性,但它似乎对我不起作用:(
    • 好吧,我可以在工作中使用它,但我无法在文档的演示插件中重现。它适用于内联日历,但不适用于弹出窗口。它可能与这个问题有关:github.com/angular-ui/bootstrap/issues/1132 我会在星期一检查我的代码,看看我是怎么做到的。
    • 这仅在您使用指令作为元素时才有效,例如 如果您使用的是
    【解决方案5】:

    要隐藏周数,您可以使用两种不同的方式。

    第一个:添加到控制器中

    $scope.dateOptions = {
        'year-format': "'yy'",
        'starting-day': 1   };
    

    或第二种方式:在输入字段中添加属性

    show-weeks="'false'"
    

    【讨论】:

    • 这仅在您使用指令作为元素时才有效,例如 如果您使用的是
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2015-06-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-12-27
    相关资源
    最近更新 更多