1

我对 Knockoutjs 真的很陌生(一般来说对 javascript 不是很好),我正在尝试映射 JSON 对象的所有可能的嵌套对象,以便每个人都是可观察的。我的印象是使用 ko.mapping.fromJS 会导致所有对象及其对象都是可观察的。但是,我没有看到这种情况发生。

我在 jsfiddle 中所做的并不是我真正在做的事情,但它确实表明我正在尝试映射一个对象,然后将嵌套值绑定到一个 HTML 跨度。

http://jsfiddle.net/Eves/L5sgW/32/ <- 编辑:将此更新为适当的 jsfiddle

HTML

<p> <span>Name:</span>
<span data-bind="text:  IntroData.Name))"></span>
</p>    

JS

$(function () {

var ViewModel = function (data) {
    var me = this;
    ko.mapping.fromJS(data, me);

    return me;
};

var stuff = {
    IntroData: {
        Name: 'Test'
    }
};
window.viewModel = ko.mapping.fromJS(new ViewModel(stuff));
ko.applyBindings(window.viewModel);
});

是否只是我必须使用映射选项才能使嵌套对象可观察?如果是这样,如果 JSON 对象如此庞大和复杂(这显然不是)怎么办?是否可以使用一些递归功能来遍历每个对象的嵌套对象以使它们都可观察?

4

1 回答 1

1

您的代码片段和 jsfiddle 存在几个问题:

  • 小提琴不包括映射插件
  • 小提琴不包括 jQuery(但无论如何都可以删除特定于 jQuery 的代码)
  • span 元素是自动关闭的,但不应该是
  • 映射插件需要“额外的映射选项”作为第二个参数,me应该是第三个参数
  • 您缺少InitialLoadOfApplication模型上的功能(尽管我不清楚它的目的是什么)
  • text在跨度上的绑定有两个不应该存在的杂散括号

如果我解决了所有这些问题,我最终会得到以下结果(另请参见this fiddle):

<p> 
    <span>Name:</span>
    <span data-bind="text: IntroData.PlanName"></span>
    <button id="update" data-bind="click: InitialLoadOfApplication">Update!</button> 
</p>

而这个Javascript:

var ViewModel = function (data) {
    var me = this; 
    ko.mapping.fromJS(data, {}, me);

    me.InitialLoadOfApplication = function() { alert('loading!'); };

    return me;
};

var stuff = {
    IntroData: {
        PlanName: 'Test'
    }
};

window.viewModel = ko.mapping.fromJS(new ViewModel(stuff));
ko.applyBindings(window.viewModel);

关于您的问题,根据我的经验,映射插件可以处理相当复杂的对象。如果你到达它的边界,总会有“额外的映射信息”来处理边缘情况。相关文档很好地解释了这些。

于 2013-07-03T14:26:17.240 回答