Question

我有一个表单，您可以在其中添加多个任务，每个任务都有一个标题和一个选项，如果您选择了一个特定选项，我想添加一个表格，您可以在其中添加一个或多个备注。我无法弄清楚的是如何将任务的注释绑定到该特定任务以及如何为每个任务监听selectedOption？这是我第一次使用淘汰赛。

<fieldset data-bind="foreach: tasks">
    Title:<input type="text" data-bind="value: title"/> 
    Option: <select data-bind="options: $root.option, optionsCaption: 'Select', value: selectedOption"></select>

    <table>
        <tbody data-bind="foreach: notes ">
           <tr>
              <td><input type="text" data-bind="value: note"/></td>
           </tr>    
        </tbody>
    </table>
   <button data-bind="click: addRow">Add note</button>
</fieldset>
<button data-bind="click: addTask">Add task</button>

Answer 1

如果为每个任务分配一个selectedOption属性和一个notes属性，它们的值将绑定到它们的父任务。

看看这个（小提琴：http://jsfiddle.net/jRyS7/2/）：

var Note = function(note){
    var self = this;
    self.note = ko.observable(note);
}

var Task = function(title, notes){
    var self = this;
    self.title = ko.observable(title);
    self.selectedOption = ko.observable();
    self.notes = ko.observableArray();
    for (var i = 0; i< notes.length; i++){ 
        self.notes.push(new Note(notes[i]));
    }   
    self.addRow = function(){
        self.notes.push(new Note("newNote"));
    }
}

var VM = function(){
    var self = this;

    self.option = [
        "option1",
        "option2"
        ]

    self.tasks = ko.observableArray([
        new Task("task1", ["note1.1", "note1.2"]),
        new Task("task2", ["note2.1", "note2.2"]),
        new Task("task3", ["note3.1", "note3.2"])
    ])

    self.addTask = function(){
        self.tasks.push(new Task("newTask", ["newNote1", "newNote2"]));
    }

}

        ko.applyBindings(new VM());

淘汰表格绑定foreach

1 个答案: