Knockout.js 在不同的HTML元素上重用敲除观察值

Knockout.js 在不同的HTML元素上重用敲除观察值,knockout.js,Knockout.js,我有一个有文本框输入的页面。我向这个文本框中添加元素,并使用一个可删除的obervable数组来显示内容。 现在我需要添加另一个文本框,创建另一个集合并显示它。 我是否需要创建另一个可观察数组和另一个方法来向数组添加元素? 我有没有办法重用代码?如果没有,我可能需要创建尽可能多的可观察数组来显示集合 dataStore: ko.observableArray([]), nameToAdd: ko.observable(''), add: func

我有一个有文本框输入的页面。我向这个文本框中添加元素,并使用一个可删除的obervable数组来显示内容。 现在我需要添加另一个文本框,创建另一个集合并显示它。 我是否需要创建另一个可观察数组和另一个方法来向数组添加元素? 我有没有办法重用代码?如果没有,我可能需要创建尽可能多的可观察数组来显示集合

 dataStore: ko.observableArray([]),        
        nameToAdd: ko.observable(''),
        add: function () {
            var val = this.nameToAdd();
            var pos = this.dataStore.indexOf(val.trim());
            if (pos === - 1 && this.nameToAdd() .length > 0 && this.nameToAdd() .trim() != '') {
                this.dataStore.push(val);
                this.nameToAdd('');
                $('#txtSetInput') .focus();
            }

逻辑的重用来自于使用构造函数来表示视图模型,而不仅仅是简单的JavaScript对象。跑完全程,如果你的时间不够,至少要这样做

对于您的场景,您可以遵循以下思路:

var ItemViewModel = function() {
    var self = this;
    self.name = ko.observable("");

};

var MainViewModel = function() {
    var self = this;
    self.dataStore = ko.observableArray([new ItemViewModel()]);    

    self.addItem = function(item) {
        self.dataStore.push(new ItemViewModel());
    };

    self.clear = function(item) {
        self.dataStore.remove(item);
    };
};

$(function () {
    var viewModel = new MainViewModel();
    ko.applyBindings(viewModel);
});
另见