使用KnockoutJS，如何绑定到数组项的子属性

Question

我有一个类似于将文本绑定到子对象的属性的问题，并且我无法正确创建可观察到的子对象的KO。

例如，我执行HTTP Get操作以返回People的JSON数组，并且People数组位于名为“ payload”的属性内。 我可以使用基本的绑定，并在有效负载属性上进行foreach的操作，显示每个Person的属性； 但是，我需要为每个Person添加一个“ status”属性，该属性是从不同的JSON接收的，例如

/api/people  (firstname, lastname, DOB, etc.)
/api/people/1/status   (bp, weight, height, etc)

我尝试绑定到status.bp和status（）。bp，但是没有运气。

js示例：

var TestModel = function (data) {
var len = data.payload.length;

for (var i = 0; i < len; i++) {

    var elem = data.payload[i];
    var statusdata = $.getJSON("http://localhost:1234/api/people/" + elem.id + "/status.json", function (statusdata) {

        elem.status = statusdata;
        data.payload[i] = elem;

        });
    }
    ko.mapping.fromJS(data, {}, this);
};

var people;

var data = $.getJSON("http://localhost:1234/api/people.json", function (data) {

    people= new TestModel(data);
    ko.applyBindings(people);
});

我需要做的2件事：1）正确通知KO“有效载荷”是ID属性的键数组2）使“状态”成为可观察到的

救命！

[更新]编辑基于Dan的答案的有效修复方法：

var TestModel = function(data) {
...
this.refresh = function () {
    $.getJSON("http://localhost:1234/api/people", function (data) {

        self.payload = ko.observableArray(); // this was the trick that did it.

        var len = data.payload.length;

        for (var i = 0; i < len; i++) {

            var elem = data.payload[i];

            $.getJSON("http://localhost:1234/api/people/" + elem.id + "/status", function (statusdata) {

                // statusdata is a complex object
                elem.status = ko.mapping.fromJS(statusdata);
                self.payload.push(elem);
            });
        }
    // apply the binding only once, because Refresh will be called with SetInterval
    if (applyBinding) {  
        applyBinding = false;
        ko.applyBindings(self);
    }
}

我对淘汰赛还是陌生的，非常欢迎对刷新功能进行改进。 每次仍在重新应用映射。

Answer 1

您需要定义一个可观察的数组，然后将数据放入其中。

elem.status = ko.observableArray();

for (var i = 0; i < statusdata.length; i++) {
    elem.status.push(statusdata[i]);
}

我无法通过示例说明数据的完整结构是什么。 但是，如果状态是一个复杂的对象，则可以用什么为其赋予自己的模型。

for (var i = 0; i < statusdata.length; i++) {
    elem.status.push(new statusModel(statusdata[i]));
}