类型错误：未定义的对象实例的模块模式 [英] TypeError: Undefined on module pattern of object instances

问题描述

这是怎样的一个跟进这个问题的：

  

<一个href=\"http://stackoverflow.com/questions/19613510/how-to-have-at-least-two-datepickers-of-ui-bootstrap-on-a-single-page\">How有用户界面，引导至少两datepickers在单个页面上？

它确实有一种优雅的方式来处理同一个视图/页的角度引导日期选择器元素的多个实例的一个伟大的工作。至少它似乎...我碰到下面的错误。

  

类型错误：无法设置属性BEGINDATE未定义

这发生在我点击尝试打开日期对话框。它发生在下面的横线，您可以在下面的code样品中看到的。实例对象是不确定的。

  method.instances [实例] =真;
 

据我所知，我的code和在其他问题的例子几乎是一样的。

例控制器code：

  $ scope.datePicker =（函数（）{    VaR方法= {};
    变种实例= [];    method.open =功能（$事件实例）{
        。$事件preventDefault（）;
        $ event.stopPropagation（）;        method.instances [实例] =真;
    };    method.minDate =新的日期（）;    method.maxDate =新的日期（2023，12，24）;    method.options = {
        formatYear：YYYY
        startingDay：1
    };    method.format =DD-MM-YYYY;    返回方法;
}（））;
 

例元素code：

 ＆LT; D​​IV CLASS =表单组＆GT;
    ＆LT;标签=BEGINDATE级=COL-MD-5＆GT;开始日期和LT; /标签＆gt;
    ＆LT;输入类型=文本名称=BEGINDATENG模型=codeCamp.B​​eginDate日期选择器，弹出={{datePicker.format}}闽日期=datePicker.minDate最大更新=datePicker.maxDate日期选择器选项=datePicker.options是开=datePicker.instances ['BEGINDATE']NG-所需=真密文=亲潮级=表格控要求/＆GT;
    ＆LT;跨度类=输入组BTN＆GT;
        ＆LT;按钮式=按钮级=BTN BTN-默认的NG点击=datePicker.open（$事件，BEGINDATE'）＆GT;＆LT; I类=glyphicon glyphicon日历＆GT;＆LT; / I＆GT;＆LT; /按钮＆GT;
    ＆LT; / SPAN＆GT;
＆LT; / DIV＆GT;
＆LT; D​​IV CLASS =表单组＆GT;
    ＆LT;标签=结束日期级=COL-MD-5＆GT;结束日期＆LT; /标签＆gt;
    ＆LT;输入类型=文本名称=结束日期NG模型=codeCamp.EndDate日期选择器，弹出={{datePicker.format}}闽日期=datePicker.minDate最大更新=datePicker.maxDate日期选择器选项=datePicker.options是开=datePicker.instances ['结束日期']NG-所需=真密文=亲潮级=表格控要求/＆GT;
    ＆LT;跨度类=输入组BTN＆GT;
        ＆LT;按钮式=按钮级=BTN BTN-默认的NG点击=datePicker.open（$事件，'结束日期'）​​＆GT;＆LT; I类=glyphicon glyphicon日历＆GT;＆LT; / I＆GT;＆LT; /按钮＆GT;
    ＆LT; / SPAN＆GT;
＆LT; / DIV＆GT;
 

解决方案

您是否尝试过创建的方法对象实例数组？

而不是这样的：

  VAR方法= {};
变种实例= [];
 

使用这样的：

  VAR方法= {};
method.instances = [];
 

让我知道！

This is kind of a follow-up to this question:

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

It does a great job of having an elegant way to handle multiple instances of angular bootstrap datepicker elements on the same view/page. At least it appears to... I get the following error.

TypeError: Cannot set property 'BeginDate' of undefined

This occurs when I click to attempt to open the date dialog. It happens on the line below, which you can see in the code sample below that. The instances object is undefined.

method.instances[instance] = true;

From what I can tell, my code and the example in the other question are nearly identical.

Example controller code:

$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;
}());

Example element code:

<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>

解决方案

Have you tried to create the instances array in the method object?

Instead of this:

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

Use this:

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

Let me know!

这篇关于类型错误：未定义的对象实例的模块模式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！