TypeError:对象实例的模块模式未定义

时间:2015-10-03 20:53:01

标签: javascript angularjs angular-ui-bootstrap

这是对这个问题的后续行动:

  

How to have at least two datepickers of ui-bootstrap on a single page?

在同一个视图/页面上处理多个角度引导日期选择器元素实例的方法非常出色。至少看起来......我得到以下错误。

  

TypeError:无法设置未定义的属性“BeginDate”

当我单击以尝试打开日期对话框时,会发生这种情况。它发生在下面的行中,您可以在下面的代码示例中看到。实例对象未定义。

method.instances[instance] = true;

据我所知,我的代码和其他问题中的例子几乎相同。

示例控制器代码:

$scope.datePicker = (function() {

    var method = {};
    var instances = [];

    method.open = function ($event, instance) {
        $event.preventDefault();
        $event.stopPropagation();

        method.instances[instance] = true;
    };

    method.minDate = new Date();

    method.maxDate = new Date(2023, 12, 24);

    method.options = {
        formatYear: "yyyy",
        startingDay: 1
    };

    method.format = "dd-MM-yyyy";

    return method;
}());

示例元素代码:

<div class="form-group">
    <label for="beginDate" class="col-md-5">Begin Date</label>
    <input type="text" name="beginDate" ng-model="codeCamp.BeginDate" datepicker-popup="{{datePicker.format}}" min-date="datePicker.minDate" max-date="datePicker.maxDate" datepicker-options="datePicker.options" is-open="datePicker.instances['BeginDate']" ng-required="true" close-text="Close" class="form-control" required />
    <span class="input-group-btn">
        <button type="button" class="btn btn-default" ng-click="datePicker.open($event, 'BeginDate')"><i class="glyphicon glyphicon-calendar"></i></button>
    </span>
</div>
<div class="form-group">
    <label for="endDate" class="col-md-5">End Date</label>
    <input type="text" name="endDate" ng-model="codeCamp.EndDate" datepicker-popup="{{datePicker.format}}" min-date="datePicker.minDate" max-date="datePicker.maxDate" datepicker-options="datePicker.options" is-open="datePicker.instances['EndDate']" ng-required="true" close-text="Close" class="form-control" required />
    <span class="input-group-btn">
        <button type="button" class="btn btn-default" ng-click="datePicker.open($event, 'EndDate')"><i class="glyphicon glyphicon-calendar"></i></button>
    </span>
</div>

1 个答案:

答案 0 :(得分:1)

您是否尝试在方法对象中创建实例数组?

而不是:

var method = {};
var instances = [];

使用此:

var method = {};
method.instances = [];

让我知道!