在angular-ui引导程序中将选项设置为datepicker [英] Setting options to datepicker in angular-ui bootstrap

查看:100
本文介绍了在angular-ui引导程序中将选项设置为datepicker的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试按以下说明使用angular-ui引导程序库中的datepicker组件: http://angular-ui.github.io/bootstrap/ 然后,我尝试为弹出式选择器设置选项,并根据文档,我应该使用datepicker-options属性将datepicker的选项作为JSON传递.

I'm trying to use datepicker component from angular-ui bootstrap lib as descibed here: http://angular-ui.github.io/bootstrap/ And I try to set options for the popup picker and accoriding to the documentation I should pass options for datepicker as JSON using the datepicker-options attribute.

我认为我有:

        <div class="row">
        <div class="col-md-6">
            <p class="input-group">
                <input type="text" class="form-control" datepicker-popup="{{format}}" ng-model="dt" is-open="opened" min="minDate" max="'2015-06-22'" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" ng-required="true" close-text="Close" />
                <span class="input-group-btn">
                <button class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>
          </span>
            </p>
        </div>
    </div>

在我的控制器中,我有:

And in my controller I have:

    $scope.dateOptions = {'show-button-bar': 'false', 'close-text':'SomeText'};

    $scope.today = function() {
        $scope.dt = new Date();
    };
    $scope.today();

    $scope.showWeeks = false;

    $scope.clear = function () {
        $scope.dt = null;
    };

    $scope.toggleMin = function() {
        $scope.minDate = ( $scope.minDate ) ? null : new Date();
    };
    $scope.toggleMin();

    $scope.open = function($event) {
        $event.preventDefault();
        $event.stopPropagation();

        $scope.opened = true;
    };

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

正如您在一开始所看到的,我尝试设置选项:

As you can see at the beginning I try to set the options:

 $scope.dateOptions = {'show-button-bar': 'false', 'close-text':'SomeText'};

但是,它似乎不起作用,日期选择器也没有更改. 有什么想法我做错了吗?

however, it doesn't seem to work, the datepicker does not change. Any ideas what I'm doing wrong?

推荐答案

我找到了解决方案,我将选项作为属性,例如:

I found the solution to this, I put the options as attributes, e.g.:

   <input type="text" class="form-control" datepicker-popup="{{format}}" ng-model="dt" is-open="opened" min="minDate" max="'2014-12-31'" datepickerOptions="dateOptions" ng-required="true" show-button-bar="false"/>

所以我把show-button-bar当作属性,而不是作为传递给datepickerOptions的对象的一部分.

so I put show-button-bar as the attribute and not as a part of object passed to datepickerOptions.

这篇关于在angular-ui引导程序中将选项设置为datepicker的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆