在Knockout中将子(嵌套)视图模型设置为null

时间:2014-03-05 07:50:59

标签: javascript knockout.js

我已经按如下方式定义了我的viewModels:

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函数来获取作业的值。在回调中,我将设置工作的价值。但是在某些提取调用期间,我可以获得作业视图模型的null值。处理这种情况的最佳方法是什么?我应该设置job=null(然后我失去我认为的绑定对象)或者我需要手动重置视图模型值并在UI中检测到job视图模型没有返回任何对象。

还有其他方法可以解决这个问题吗?我是Knockout的新手。

编辑:
以下是定期提取期间的结果列表,我需要根据此更新我的视图模型。

|Request | result   |
 -------------------
| 1      | non-null |
| 2      | non-null |
| 3      | null     |
| 4      | null     |
| 5      | non-null |

1 个答案:

答案 0 :(得分:1)

我可以提示你总是创建JobViewModel,但是在ResultLastJob方法中初始化它。当从服务器收到的数据为空时,JobViewModel将使用默认值进行初始化。此解决方案的主要优点是视图上的一个逻辑(您不应添加JobViewModel的任何检查不为空等):

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);
    }
}