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

时间:2016-11-02 07:44:29

标签: angularjs typescript bootstrap-datetimepicker

我在我的应用程序中使用Gillardo bootstrap-ui-datetime-picker,我想覆盖一些默认设置(想要删除buttonBar)。为此,我使用了以下代码,但这并没有解决我的问题(代码来自图书馆文献uiDatetimePickerConfig Documentation)。我也搜索过,但没有找到任何帮助。

注意:图书馆工作正常我只想删除buttonBar

buttoBar

任何建议。

这里的html显示了datetimepicker

<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

    }

1 个答案:

答案 0 :(得分:0)

经过很长一段时间的花费才找到了一条路,但这不是一个全球性的。刚在输入元素中添加了这一行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>

After problem solved