0

我的 MVC 剃刀视图呈现此标记:

function existingNamingsViewModel() {
            var self = this;
            var initialData = @Html.Raw(new JavaScriptSerializer().Serialize(Model));
            self.ExistingNamings = ko.observableArray(initialData);
        }
        ko.applyBindings(new existingNamingsViewModel(), document.getElementById("namings-control"));

进入正确的 JS 序列化代码,initialData变量初始化为:

var initialData = [{"TypeName":"Orders","NameBlocks":["{intInc_G}","/","{intInc_D}","/02/-","{yy}"],"ParamBlocks":["2296","","1","",""]}];

在应用 ko 绑定后,生成的 html 采用可编辑网格的形式: 在此处输入图像描述

每当用户更改这些输入字段中的数据时,我需要 knockoutJS 能够自动更新视图模型。但由于视图模型是从简单的 JSON 对象初始化的,NameBlocksParamBlocks不是ko.observableArray. 我需要他们。我如何实现这一目标?

PS 一个想法是进行更复杂的初始化,其中 razor 仅序列化Name/ParamBlocks数组,并ExistingNamings通过 javascript 代码手动填充数组,创建一个自定义命名类对象,该对象Name/ParamBlocks包装到ko.observableArray. 但这是唯一的方法吗?

4

1 回答 1

1

有一个可用的映射插件可以为您解决问题,但您可能需要更改数据传递的方式。

映射插件提供了一个将 JSON 对象映射到视图模型的函数:

var viewModel = ko.mapping.fromJS(data);

但请注意,在文档中(链接到上面),JSON 对象中的所有属性都被命名。

initialData您在示例中提供的数组包含只是值的集合,而不是命名值的集合。

此外,initialData是一个包含单个对象的数组。如果这种情况总是需要一个对象,那么这个解决方案就更容易了。

假设您能够以initialData以下格式交付:

var initialData = {
    "TypeName":"Orders",
    "NameBlocks": [
        {"block":"{intInc_G}"},
        {"block":"/"},
        {"block":"{intInc_D}"},
        {"block":"/02/-"},
        {"block":"{yy}"}
    ],
    "ParamBlocks":[
        {"block":"2296"},
        {"block":""},
        {"block":"1"},
        {"block":""},
        {"block":""}
    ]
};

然后创建视图模型将像下面这样简单:

var viewModel = ko.mapping.fromJS(initialData);

$(function() {
   ko.applyBindings(viewModel); 
});

这是我设置的小提琴,因此您可以看到它的实际效果:http: //jsfiddle.net/jimmym715/qUjLQ/

希望您的解决方案将像一些数据格式更改和映射插件的使用一样简单。

无论如何,映射插件应该会引导您朝着正确的方向前进。

于 2012-07-28T20:54:04.150 回答