如何在 angularjs 中设置 Gillardo/bootstrap-ui-datetime-picker 的全局配置答案

【问题标题】：How to set global configuration of Gillardo/bootstrap-ui-datetime-picker in angularjs如何在 angularjs 中设置 Gillardo/bootstrap-ui-datetime-picker 的全局配置
【发布时间】：2016-11-02 07:44:28
【问题描述】：

我在我的应用程序中使用 Gillardo bootstrap-ui-datetime-picker，我想覆盖一些默认设置（想要删除 buttonBar）。为此，我使用了以下代码，但无法解决我的问题（代码来自库文档uiDatetimePickerConfig Documentation)。我也搜索过，但没有找到任何帮助。

注意：图书馆工作正常，只是我想删除 buttonBar

任何建议。

这里是显示日期时间选择器的html

<p class="input-group">
                          <input type="text" class="form-control ng-valid ng-isolate-scope ng-valid-datetime ng-dirty ng-touched ng-not-empty"
                                               datetime-picker="HH:mm" ng-model="range.endTime"
                                               is-open="range.dEndTime" enable-date="false" 
                                               readonly>
                                        <span class="input-group-btn">
                                            <button type="button" class="btn btn-default" ng-click="controller.openCalendar($event,range,2)"><i class="fa fa-clock-o"></i></button>
                                        </span>

                                    </p>

Library

库注入

var myAdminApp = new FHCommon.Module("FHAdminApp", ["daterangepicker", "ui.bootstrap", "ui.bootstrap.datetimepicker"]); //some injection have removed where are not relevant

配置

 myAdminApp.config(($stateProvider, $urlRouterProvider) => {

    $urlRouterProvider.otherwise("/login");

    myAdminApp.constant('uiDatetimePickerConfig',
    {
        dateFormat: 'yyyy-MM-dd HH:mm',
        defaultTime: '00:00:00',
        html5Types: {
            date: 'yyyy-MM-dd',
            'datetime-local': 'yyyy-MM-ddTHH:mm:ss.sss',
            'month': 'yyyy-MM'
        },
        initialPicker: 'date',
        reOpenDefault: false,
        enableDate: true,
        enableTime: true,
        //buttonBar: {
        //    show: true,
        //    now: {
        //        show: true,
        //        text: 'Now'
        //    },
        //    date: {
        //        show: true,
        //        text: 'Date'
        //    },
        //    time: {
        //        show: true,
        //        text: 'Time'
        //    },
        //    close: {
        //        show: true,
        //        text: 'Close'
        //    }
        //},
        closeOnDateSelection: true,
        closeOnTimeNow: true,
        appendToBody: false,
        altInputFormats: [],
        ngModelOptions: {},
        saveAs: false,
        readAs: false,
    });

//other code

    }

【问题讨论】：

所以我猜你在评论所有内容之前尝试将show 参数设置为false？
@VassilisPits 我找到了解决方案并在答案中解释。

标签： angularjs typescript bootstrap-datetimepicker

【解决方案1】：

花了很长时间才找到一种方法，但这不是全局的。刚刚在输入元素中添加了这一行button-bar="{{false}}"。

代码

<p class="input-group">
                                        <input type="text" class="form-control ng-valid ng-isolate-scope ng-valid-datetime ng-dirty ng-touched ng-not-empty"
                                               datetime-picker="HH:mm" ng-model="range.endTime"
                                               is-open="range.dEndTime" enable-date="false" 
                                               button-bar="{{false}}" readonly>
                                        <span class="input-group-btn">
                                            <button type="button" class="btn btn-default" ng-click="controller.openCalendar($event,range,2)"><i class="fa fa-clock-o"></i></button>
                                        </span>

                                    </p>

【讨论】：