Question

我遇到问题让一个foreach循环在KnockOut.js中工作，甚至当我试图让代码抛出错误时它也没有。就好像它根本没有尝试绑定到表格一样。

var History = function (data) {
    this.Average = ko.observable(data.Average);
    this.Count = ko.observable(data.Count);
};

var DataSource = function (data) {
    var convertData = function (array) {
        return $.map(data.Data, function (option) {
            return new History;
        });
    };

    this.Data = ko.observableArray(this.convertData());

    return {
        'Data': this.Data
    };
};

var dataMappingOptions = {
    create: function (options) {
        return new DataSource(options);
    }
};

var dataModel = function () {
    this.source = ko.mapping.fromJS({ 'Data': [], 'Percentage': 0 });
};

currentViewModel = new dataModel();
ko.applyBindings(currentViewModel);

我已经删除了很多复杂性，因为其他一切都有效。基本上我使用Knockout.Mappings将AJAX响应映射到这些对象并为计算字段添加函数。这里的HTML似乎忽略了我所做的一切;它会显示，但没有任何结合。

<table>
    <thead>
        <tr>
            <th>Average</th>
            <th>Frequency</th>
        </tr>
    </thead>
    <tbody data-bind="foreach: kjhkjh">
        <tr>
            <td data-bind="text: $data.Average()"></td>
            <td data-bind="value: $data.Average"></td>
            <td data-bind="text: $data.Average"></td>
            <td data-bind="value: $data.Average()"></td>
            <td>Test</td>
        </tr>
    </tbody>
</table>

由于kjhkjh对象没有绑定，我认为它会抛出错误，但事实并非如此。即使我放入source.Data它也没有做任何事情;它只显示静态表，没有任何绑定。

更新：为了从Javascript中获取任何值，我必须使用这样的东西：

console.log(currentViewModel.source.Data()[11].Average());

Answer 1

这部分似乎不正确。您在同一个语句中有两个返回。尝试在return

之前删除$.map(

var convertData = function (array) {
    return $.map(data.Data, function (option) {
        return new History;
    });
};

也可能是您为this对象的私有方法convertData()引用DataSource。从此处删除this：

ko.observableArray(this.convertData());

Answer 2

我遇到的错误是由于我的Knockout模型在页面上的位置造成的。一旦我移动了脚本标记，引用了表格下面的JS文件，它正常工作。这就是除了这个摘录之外所有页面都工作的原因。这部分是因为我把它作为一个全局变量作为页面的多个部分，需要几个JS文件来引用它。

据说Stockedout确实指出了我能够改进代码的一些方法。

与复杂的Knockout.js对象进行数据绑定

2 个答案: