订阅包含成员ko.observable()的ko.observableArray()

时间:2013-12-09 18:37:25

标签: knockout.js

我正在从服务器发送的数据中动态构建我的视图模型,并且已针对此示例进行了简化。

除了我的主要表单,我计划运行一个汇总表单,它将遍历所有可用的observable并对数据执行某些操作。

我使用了一个ko.observableArray(),认为它是一个容易转储所有成员observable的地方,只是订阅更改。

我的问题是订阅永远不会被解雇。我有什么想法吗?

请注意我对其他解决方案持开放态度,只要我的摘要视图模型可以通知所选值(动态构建的长度和名称会有所不同)何时发生变化,这样就可以了。对我而言,使用什么技术。

代码和fiddle here:

var createUserViewModel = function(names)
{
    var model = {};

    var length = names.length;

    model.selectedValues = ko.observableArray();

    for (var i = 0; i < length; i++) {
        model[names[i]] = ko.observable();
        model.selectedValues.push(model[names[i]]);
    }    
    return model;
}

var createSummaryViewModel = function(userViewModel){
        userViewModel.selectedValues.subscribe(function(newValue){
        console.log("yeah something has changed!");
        // loop through values here to get currently selected objects
    });
}

var createMasterVm = function(names){
    var self = this;
    self.userViewModel = ko.observable(createUserViewModel(a));
    self.summaryViewModel = ko.observable(createSummaryViewModel(self.userViewModel()));
    return self;
}

var a = new Array();
a.push("name");
a.push("age");
a.push("street");

ko.applyBindings(createMasterVm(a));

1 个答案:

答案 0 :(得分:2)

动态参数很棒。我觉得我有一个很棒的解决方案......一点点返工,你现在得到的东西比原来的小提琴更有活力::

http://jsfiddle.net/XSqL4/10/

需要注意的主要事项之一是将所需的对象简化为整个模型的ViewModel对象,然后用一个较小的对象来模拟你投入的键/值对。 / p>

var NameValuePair = function (name){
    var self = this;
    self.name = name;
    self.value = ko.observable();
}

此外,你的加价现在完全是动态的......

<!-- ko foreach: selectedValues -->
<p>
    <label data-bind="text: name"></label> 
    <input data-bind="value: value" />
    <label data-bind="text: value"></label>
</p>
<!-- /ko -->

希望这对你来说是一个很好的微小项目,用于推动未知的键值对。