1

我在一个使用来自 RESTful API 的 JSON 的富 Web 客户端中使用了Knockout.js + Knockout 映射插件+ jQuery的组合。

我需要一些关于如何在我的视图模型中处理空值的指导。这是我的场景和我遇到的问题：

REST API 返回的大多数数据成员都是可以为空的。为了解决这个问题，我将一个带有空值的 JSON 样本传递给映射插件：

um.jsonMaps.campaign = {
    "priority": null,
    "recipientListId": null,
    "autoPrepare": null,
    "timeToSend": null
}

我像这样进行初始绑定：

this.model = ko.mapping.fromJS(um.jsonMaps.campaign);

以下是来自 API 调用的一些数据：

var data= {
    "priority": 95,
    "recipientListId": "a2aac72a-59f6-45da-a636-a48cc2b20137",
    "autoPrepare": false,
    "timeToSend": null
}

...它是这样绑定的：

ko.mapping.fromJS(data, this.viewModel.model);

问题在于，如果用户修改或触摸绑定到此数据的任何 UI 元素，他们会隐式地将模型中的数据成员转换为带引号的字符串字面量。因此，如果用户添加一些文本并将其删除，整数95将变为“95” 。如果在 UI 中触摸了 API 中为 null 的值，则它变为“”（例如空字符串）。

我需要整数和空值在编辑后保留为整数和空值。

4

2 回答 2

3

在我的项目中，我最终通过来自服务器的数据创建了视图模型。我使用 getter 和 setter 添加了新属性，以便在需要时写入数值：

function DataViewModel(dataModel) {
    var self = this;
    self.priority = ko.observable(dataModel.priority);
    self.recipientListId = ko.observable(dataModel.recipientListId);
    self.autoPrepare = ko.observable(dataModel.autoPrepare);
    self.timeToSend = ko.observable(dataModel.timeToSend);



    self.priorityKo = ko.computed({
        read: function () {
            return self.priority().toFixed(2);
        },
        write: function (value) {
            value = parseFloat(value.replace(/[^\.\d]/g, ""));
            if (isNaN(value)) {
                self.priority(-1); // to fire 'changed' event
                self.priority(0); // final value in case of incorrect user input
            } else {
                self.priority(value); // real numeric value
            }
        },
        owner: this
    });

您的映射将如下所示：

this.model = ko.mapping.fromJS(new DataViewModel(um.jsonMaps.campaign));
于 2012-06-14T23:55:37.257 回答
1

您可以使用 Ryan 的Smart Dirty Flag扩展作为如何处理它的基础。

或者你可以手动完成同样的事情，但他的文章仍然是你正在处理的一个很好的起点。

于 2012-06-14T23:52:02.970 回答