Question

让我们说我的控制器产生了这样的json：

{
    "$id": "1",
    "$values": [{
        "$id": "2",
        "kodg": -1643387437,
        "name": null,
        "data": "2014-02-07T00:00:00",
        "pax": 2,
        "ch": 0
    }, {...}]
}

我需要在子节点中以某种方式获取值（从$ id：2开始）才能将其绑定到UI，但我不知道如何做到这一点。请指教。

P.S。 foreach不在这里工作：

<script>
        function BookViewModel() {
            var baseUri = '/api/grafik/205693'
            var self = this;
            self.kodg = ko.observable("");
            self.name = ko.observable("");
            self.data = ko.observable("");
            self.pax = ko.observable("");
            self.child = ko.observable("");
            var book = {
                kodg: self.kodg,
                name: self.name,
                data: self.data,
                pax: self.pax,
                child: self.child
            };
            self.book = ko.observable();
            self.books = ko.observableArray();
            $.getJSON(baseUri, self.books);
        }
        $(document).ready(function () {
            ko.applyBindings(new BookViewModel());
        });
    </script>

这就是我的约束方式。

<table>
        <thead>
            <tr>
                <td>kodg</td>
                <td>name</td>
                <td>data</td>
                <td>pax</td>
                <td>child</td>
            </tr>
        </thead>
        <tbody data-bind="foreach: books">
            <tr>
                <td>
                    <input type="text" data-bind="value: $data.kodg" />
                </td>
                <td>
                    <input type="text" data-bind="value: $data.name" />
                </td>
                <td>
                    <input type="text" data-bind="value: $data.data" />
                </td>
                <td>
                    <input type="text" data-bind="value: $data.pax" />
                </td>
                <td>
                    <input type="text" data-bind="value: $data.child" />
                </td>
            </tr>
        </tbody>
    </table>

Answer 1

有几件事。

您对self的使用是多余的。 self用于在函数中创建对假定上下文的闭包，该函数稍后作为排序的回调传递 - 以保留该上下文：

var self = this;
$('#target').on('click', function() {
   self.someMethodOfTheAboveThis(); 
});

此外，getJSON是异步方法，它看起来并不像你认为的那样。

您的用法应该是：

调用getJSON，同时向其传递一个回调，该回调将在从服务器收到响应时调用
填充您的books可观察数组

这些方面的东西：

$.getJSON(baseUri, function(data) {
    self.books(data.$values);
});

现在这样做的方式不正确有两个原因：

您没有将回调传递给getJSON
即使确实有效，getJSON也能以某种方式将数据转储到books上 - 它会覆盖没有KO的可观察数组或绑定DOM知道它。

编辑：澄清最后一点 - books巧合地是一个函数，但它将填充的数据不应该填充到books。

使用knockout.js解析JSON中的子节点

1 个答案: