Methods 使用knockout并尝试将一些新数据推送到数组中,我得到了未定义的错误。为什么?

Methods 使用knockout并尝试将一些新数据推送到数组中,我得到了未定义的错误。为什么?,methods,knockout.js,push,undefined,Methods,Knockout.js,Push,Undefined,我正在处理数组对象和敲除js。下面的一些代码使数据可用于绑定,并且一切正常。但是当我试图在数组行中推送一些数据时,我收到了以下错误消息: 未捕获的TypeError:无法调用未定义的方法“push” ADMIN_gym_demo3.html:217 现在我不明白为什么那个建筑没能起作用 Objects = {days: [ {day: 'Monday', row:[{ col1: '100', col2: '200', col3: '300', c

我正在处理数组对象和敲除js。下面的一些代码使数据可用于绑定,并且一切正常。但是当我试图在数组行中推送一些数据时,我收到了以下错误消息:

未捕获的TypeError:无法调用未定义的方法“push” ADMIN_gym_demo3.html:217

现在我不明白为什么那个建筑没能起作用

Objects = {days: [
        {day: 'Monday', row:[{
                col1: '100', col2: '200', col3: '300', col4: '400', col5: '500'
            },{
                col1: '100', col2: '200', col3: '300', col4: '400', col5: '500'
            },{
                col1: '100', col2: '200', col3: '300', col4: '400', col5: '500'
            }]},{//////////////////////////////////////////////////////////////
        day: 'Tuesday', row:[{
                col1: '100', col2: '200', col3: '300', col4: '400', col5: '500'
            },{
                col1: '100', col2: '200', col3: '300', col4: '400', col5: '500'
            },{
                col1: '100', col2: '200', col3: '300', col4: '400', col5: '500'
            }]},{//////////////////////////////////////////////////////////////
        day: 'Wednesday', row:[{
                col1: '100', col2: '200', col3: '300', col4: '400', col5: '500'
            },{
                col1: '100', col2: '200', col3: '300', col4: '400', col5: '500'
            },{
                col1: '100', col2: '200', col3: '300', col4: '400', col5: '500'
            }]}///////////////////////////////////////////////////////////////

    ]};


var ViewModel = function(){
    var self = this;

    cont = ko.mapping.fromJS(Objects);
    alld = cont.days;
    thisrow = self.row;
    crow = alld.thisrow;

    val1 = ko.observable('');
    val2 = ko.observable('');
    val3 = ko.observable('');
    val4 = ko.observable('');
    val5 = ko.observable('');

    add = function(){

            var vm1 = val1;
            var vm2 = val2;
            var vm3 = val3;
            var vm4 = val4;
            var vm5 = val5;

            crow.push({
                col1: vm1(), col2: vm2(), col3: vm3(), col4: vm4(), col5: vm5() });
            };
    }; 

    ko.applyBindings(new ViewModel);
这就是html的外观:

<div data-bind="foreach: alld">
                    <p data-bind="text: day"></p>
                    <table class="table table-striped table-condensed" >        
                    <thead>
                    <tr>
                        <th>time</th>
                        <th>training time</th>
                        <th>difficulty</th>
                        <th>coach</th>
                        <th>gym</th>
                    </tr>
                    </thead>

                    <tbody data-bind="foreach: row">

                    <tr >
                        <td data-bind="text: col1">7.00-10.00</td>
                        <td data-bind="text: col2">bodypump</td>
                        <td data-bind="text: col3">I-III</td>
                        <td data-bind="text: col4">Michael Ivanov</td>
                        <td data-bind="text: col5">01</td>
                    </tr>

                    </tbody>


                </table>

                <div style="width: 100%" >
                        <div style="display: inline; float: left; width: 20%"  >
                            <input data-bind="value: val1" />             
                        </div>                                            
                        <div style="display: inline; float: left; width: 20%">
                            <input data-bind="value: val2" />            
                        </div>                                           
                        <div style="display: inline; float: left; width: 20%">
                            <input data-bind="value: val3" />             
                        </div>                                            
                        <div style="display: inline; float: left; width: 20%">
                            <input data-bind="value: val4" />             
                        </div>                                            
                        <div style="display: inline; float: left; width: 20%">
                            <input data-bind="value: val5" />
                        </div>
                        <a href="#" data-role="button" data-icon="star" data-iconpos="right" data-mini="true" data-bind="click: add" >Add row</a>    

                </div>

时间 训练时间 困难 教练 健身房 7.00-10.00 杠铃操 I-III 迈克尔·伊万诺夫 01
谁能告诉我哪里出了错? 以下是我的建议:

错误是“无法调用未定义的方法push”。这意味着您尝试调用push-on的对象未定义。让我们看看调用push的代码行:

alld.row.push(...);
错误消息告诉您alld.row未定义。让我们看看alld从何而来,看看我们能否找出alld上的row属性未定义的原因:

alld = ko.observableArray();
alld = Objects.days;
它首先被制作成一个observableArray,但当它被重新定义为Object.days时,它就消失了。让我们看看Objects.days是在哪里定义的,以及为什么它没有名为“row”的属性

Objects = {days: [
  { day: 'Monday', row:[...] },
  { day: 'Tuesday', row:[...] },
  { day: 'Wednesday', row:[...] }
]};
Objects.days是一个数组。数组中的每个项都有一个名为row的属性,但数组本身没有一个名为row的属性。因此,如果要将某些内容放入行数组中,首先必须确定要放入哪一个-您有三个-一个用于星期一,一个用于星期二,一个用于星期三。如果您想推进周一的阵列,可以执行以下操作:

alld[0].row.push(...);
总的来说,我不确定你在这里想做什么。您的标记和代码有几个问题,因此代码的用途对我来说有点神秘。但这里还有一些你应该调查的事情:

作为一个孩子,你有一个div。您应该只将tr作为tbody的子女,而td位于tr的内部。然后,div可以是tr的子级

在div中有一个原始数据绑定字符串,如下所示(不包括#Monday的其他子项):

cont从未在任何地方使用过,alld最终成为一个数组(而不是一个可观察的数组)。我猜你是想做这样的事:

var cont = ko.mapping.fromJS(Objects);
alld = cont.days;
这将使alld成为一个可观察的数组,其中包含来自对象的数据

我前面提到过,您有以下两行代码:

alld = ko.observableArray();
alld = Objects.days;
第一行是完全无用的,因为在第一行中创建的observableArray在您为alld分配不同的内容时被删除。这种模式在代码中多次存在

卓尔是什么?drow是alld.row-正如刚才讨论的,这是未定义的,所以不能像调用构造函数一样使用new关键字调用它

什么是自我?你从不定义自己。通常,在使用敲除时,您会将其放在viewmodel的顶部:

var self = this;

谢谢你的回复!我非常感谢你的分析和建议。这给我的工作带来了更多的阳光),但我仍然无法将数据推入行数组/我根据您的建议所做的更改有效:
cont=ko.mapping.fromJS(Objects);所有d=连续天数看起来工作正常,但我仍然不知道如何将一些数据推送到行数组中。对于days数组的每个对象,我都有一个类似的输入字段,它应该只将数据推送到一个对应的数组中。我用JSFIDLE更新了主题:1。将alld定义为self.alld。2.将viewmodel保存在变量中,以便可以从javascript访问它。3.推送到viewmodel上alld内部的行数组。更新小提琴:已经做了。但如果我定义self.alld html甚至没有显示来自days数组的数据:您有无限递归:new ViewModel()正在调用newViewModel()。试试这个。我还为每天创建了单独的val1/val2/etc.属性。非常感谢您!但什么是add函数中的调试器?
alld = ko.observableArray();
alld = Objects.days;
var self = this;