数据绑定不起作用,但在教程中工作正常

时间:2013-05-24 14:51:17

标签: data-binding knockout.js

我是knockout.js的新手。我正在关注this教程。它在淘汰赛网站上运行良好但不适合我。错误控制台也没有显示任何错误。 以下是我的代码 视图:     

任务

<form data-bind="submit: addTask">
    Add task: <input data-bind="value: newTaskText" placeholder="What needs to be done?" />
    <button type="submit">Add</button>
</form>
<div >
<ul data-bind="foreach: tasks, visible: tasks().length > 0" id="testing">
    <li>
        <input type="checkbox" data-bind="checked: isDone" />
        <input data-bind="value: title, disable: isDone" />
        <a href="#" data-bind="click: $parent.removeTask">Delete</a>
    </li>
</ul>
</div>

查看型号:

<script>
function Task(data) {
    this.title = ko.observable(data.title);
    this.isDone = ko.observable(data.isDone);
}

function TaskListViewModel() {
    // Data
    var self = this;
    self.tasks = ko.observableArray([]);
    self.newTaskText = ko.observable();
    self.incompleteTasks = ko.computed(function() {
        return ko.utils.arrayFilter(self.tasks(), function(task) { return !task.isDone() });
    });

    // Operations
    self.addTask = function() {
        self.tasks.push(new Task({ title: this.newTaskText() }));
        self.newTaskText("");
    };
    self.removeTask = function(task) { self.tasks.remove(task) };
}

ko.applyBindings(new TaskListViewModel(),document.getElementById("testing"));
</script>

1 个答案:

答案 0 :(得分:0)

问题是ko.applyBindings不适用于所有数据绑定属性。将您的“测试”ID移动到覆盖所有HTML代码的地方,并使用相关的“数据绑定”属性。