在 Knockout 中将子（嵌套）视图模型设置为 null

Question

我的 viewModel 定义如下：

var uiViewModel = {
    updateLive: ko.observable(true),
    sendEnabled: ko.observable(true)
};

var JobViewModel = function () {
    this.ID = ko.observable();
    this.EndedAt = ko.observable();
    this.StartedAt = ko.observable();
};

var viewModel = {
    ui: uiViewModel,
    job: new JobViewModel()
};

ko.applyBindings(viewModel);

// Callback function from AJAX call
var _ResultLastJob = function (result) {
    if (result.success) {
        if (result.job == "null") {
            // What happens if returned job object is null?
            viewModel.job = null;
            // OR reset the object
            //viewModel.job.ID(null);
            //viewModel.job.StartedBy("");
        }
        else {
            var jobData = JSON.parse(result.job);
            if (viewModel.job == null) {
                // If job was null create a new one, 
                //  however, this will not be bound to KO
                var newJob = new JobViewModel();
                viewModel.job = newJob;
            }
            ko.mapping.fromJS(jobData, {}, viewModel.job);
        }
    }
}

// Somewhere I call to get result, this is called periodically on the same page
$.get(url, _ResultLastJob);

我会定期调用 ajax 函数来获取作业的价值。在回调中，我将设置作业的值。然而，在一些 fetch 调用中，我可以获得工作视图模型的 null 值。处理这种情况的最佳方法是什么？我应该设置job=null（然后我会丢失我认为的绑定对象）还是我需要手动重置视图模型值并在 UI 中检测到没有为job 视图模型返回对象。

还有其他方法可以解决这个问题吗？我是新来的淘汰赛。

编辑：
这是定期获取期间的结果列表，我需要基于此更新我的视图模型。

|请求 |结果 | ------------------ | 1 |非空 | | 2 |非空 | | 3 |空 | | 4 |空 | | 5 |非空 |

Answer 1

我可以建议你总是创建JobViewModel，但在ResultLastJob 方法中初始化它。当从服务器接收的数据为空时，JobViewModel 将被初始化为默认值。这个解决方案的主要优点是一个逻辑视图（你不应该添加任何检查 JobViewModel is not null 等）：

var UiViewModel = function() {
    var self = this;
    self.updateLive = ko.observable(true);
    self.sendEnabled = ko.observable(true);
};

var JobViewModel = function () {
    var self = this;
    self.ID = ko.observable();
    self.EndedAt = ko.observable();
    self.StartedAt = ko.observable();

    self.init = function(data) {
        self.ID(data ? data.ID : null);
        self.EndedAt(data ? data.EndedAt : null);
        self.StartedAt(data ? data.StartedAt : null);
    }   
};

var viewModel = {
    ui: new UiViewModel(),
    job: new JobViewModel()
};



var _ResultLastJob = function (result) {
    if (result.success) {
        viewModel.job.init(result.job);
    }
}