Question

我有一个observablearray，称为文档，我从API调用的结果中加载了JSON。然后我使用文档加载当前选定的文档。代码如下：

self.documents = ko.observableArray();

self.document = {
    DocID: ko.observable(),
    DocName: ko.observable(),
    isDocumentEdit: ko.observable(false)  
}

function populateDocumentLocations() {
    ajaxHelper(url + '/api/Documents/' + self.businessList.busID().busID, 'GET').done(function (data) {
        self.documents(data);
    });
}

function ajaxHelper(uri, method, data) {
    return $.ajax({
        type: method,
        url: uri,
        dataType: 'json',
        contentType: 'application/json',
        data: data ? JSON.stringify(data) : null
    }).fail(function (jqXHR, textStatus, errorThrown) {
        alert(errorThrown);
    });
}

API返回的两个属性是DocID和DocName。一切正常。我在文档中添加了第三个字段（如上所述），＆＃34; isDocumentEdit＆＃34;所以我知道用户是否点击过＆＃34;编辑＆＃34;按钮与否（相应地更改GUI）。

然而，isDocumentEdit的值仍为＆＃34; undefined＆＃34;而不是假的。

我也试过循环播放＆＃34;文件＆＃34;并添加＆＃34; isDocumentEdit = false＆＃34;对于每个元素，但是没有用。

是否可以在加载后向observable添加另一个参数？或者有没有办法在进行API调用时加载它（这是我尝试循环并添加但没有工作的地方）？

Answer 1

当数据从ajax调用返回时，它需要映射到包含observable的模型。

首先声明Document viewModel：

function Document (document) {
    var self = this;

    self.DocID = ko.observable(document.DocID);
    self.DocName = ko.observable(document.DocName);
    self.isDocumentEdit = ko.observable(false);
}

然后你可以使用jQuery $ .map函数将json响应映射到你的文档：

function populateDocumentLocations() {
    ajaxHelper(url + '/api/Documents/' + self.businessList.busID().busID, 'GET').done(function (data) {
        var mappedDocuments = $.map(data, function(document) { return new Document(document) });
        self.documents(mappedDocuments);
    });
}

这也是Knockout教程中的一个很好的参考：http://learn.knockoutjs.com/#/?tutorial=loadingsaving

使用KnockoutJS从API加载后，将字段添加到observableArray

1 个答案: