Question

有人可以建议为什么下面的映射无法正常工作吗？该表使用正确的行数正确呈现。 <td data-bind="text: Rank"></td>按预期解析，但没有其他数据绑定成功。但是，调试器不会返回任何错误。

的Json

[{ “等级”：1， “IntegerList”：{ “IntegerListID”：14， “方向”： “升序”， “性能”：451， “整型”：[{ “IntegerValue”：0}，{ “IntegerValue”：0}]}}，{ “等级”：2 “IntegerList”：{ “IntegerListID”：13， “方向”： “升序”， “性能”：504， “整型”：[{“IntegerValue “：0}，{” IntegerValue “：0}]}}，{” 等级 “：3”，IntegerList “：{” IntegerListID “：18，” 方向 “：” 升序 “ ”性能“：514，” 整型“：[{” IntegerValue “：1}，{” IntegerValue “：2}]}}，{” 等级 “：4”，IntegerList “：{” IntegerListID “：19，” 方向 “：” 升序 “” 性能“：515，” 整型 “：[{” IntegerValue “：2}，{” IntegerValue “：3}，{” IntegerValue“：4}]}}]

敲除

function rankedIntegerLists(data) {
    this.Rank = data.Rank;
    this.IntegerList = ko.observableArray([this.IntegerListID = data.IntegerListID,
                                           this.Performance = data.Performance,
                                           this.Direction = data.Direction,
                                           this.Integers = ko.observableArray(data.Integers)]);
    }

$.getJSON("/Home/GetIntegerLists", function (allData) {
    var mappedIntegers = $.map(allData, function (item) { return new rankedIntegerLists(item) });
    viewModel.integerlists(mappedIntegers);
});

viewModel.integerlists = ko.observableArray([]);

HTML

<tbody data-bind="foreach: integerlists">
    <tr>
        <td data-bind="text: Rank"></td>
        <td>
            <ul class="integers" data-bind="foreach: IntegerList.Integers">
                <li data-bind="text: IntegerValue"></li>
            </ul>
        </td>
        <td data-bind="text: IntegerList.Direction"></td>
        <td data-bind="text: IntegerList.Performance"></td>
    </tr>
</tbody>

修改

ko.toJSON（$ data，null，2）返回以下内容。显然，它是未映射的IntegerList observablearray。

"integerlists": [
{
  "Rank": 1,
  "IntegerList": [
    null,
    null,
    null,
    null
  ]
},
{
  "Rank": 2,
  "IntegerList": [
    null,
    null,
    null,
    null
  ]
},
{
  "Rank": 3,
  "IntegerList": [
    null,
    null,
    null,
    null
  ]
},
{
  "Rank": 4,
  "IntegerList": [
    null,
    null,
    null,
    null
  ]
},
{
  "Rank": 5,
  "IntegerList": [
    null,
    null,
    null,
    null
  ]
}]

Answer 1

我并不是说这是你唯一的问题，或者是专门解决你的问题，但我认为在这种情况下使用模型进行调试和清除代码是更好的做法。另外，在代码中使用var self = this以确保您仍处于正确的范围/上下文中。

function integerListModel(data) {
   var self = this;
   self.IntegerListID = ko.observable(data.IntegerListID);
   self.Performance = ko.observable(data.Performance);
   self.Direction = ko.observable(data.Direction);
   self.Integers = ko.observableArray(data.Integers);
}

function rankedIntegerLists(data) {
    var self = this;
    self.Rank = data.Rank;
    self.IntegerList = new integerListModel(data);
}

如果您仍然没有获取数据，请尝试更新您的代码并在其中输入一些console.log，它可以帮助您找出原因。

映射包含observablearray的对象，该observablearray包含observablearray

1 个答案: