Data binding 数据绑定不起作用，但在教程中可以正常工作

我不熟悉

knockout.js

。我正在学习教程。它在淘汰赛现场运行良好，但对我来说不是。错误控制台也没有显示任何错误。 下面是我的代码 视图： 任务

添加任务：
添加

视图模型：

<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>

功能任务（数据）{
this.title=ko.可观察（data.title）；
this.isDone=ko.可观测（data.isDone）；
}
函数TaskListViewModel（）{
//资料
var self=这个；
self.tasks=ko.observearray（[]）；
self.newTaskText=ko.observable（）；
self.incompleteTasks=ko.computed（函数（）{
return ko.utils.arrayFilter（self.tasks（），function（task）{return！task.isDone（）}）；
});
//操作
self.addTask=函数（）{
push（新任务（{title:this.newTaskText（）}））；
self.newTaskText（“”）；
};
self.removeTask=函数（任务）{self.tasks.remove（任务）}；
}
应用绑定（新的TaskListViewModel（），document.getElementById（“测试”）；

问题在于ko.applyBindings并不适用于所有数据绑定属性。将您的“测试”id移动到一个地方，在那里它包含了所有具有相关“数据绑定”属性的HTML代码。

如果您想要对您的问题进行认真的反馈，您必须提供更多详细信息-您是否包含了淘汰库？你的样式表怎么样？您尝试过单步执行代码吗？@mhoff所有文件都正确包含，因为我可以通过firebugah看到它。newTaskText（）也可以使用它，因为它是一个闭包。您是否在浏览器控制台中看到任何警告？是。所有这些都与css问题有关，除了这一个

对突变事件的使用被贬低。改用MutationObserver

ko.applyBindings调用不包括表单中的绑定。也许您应该在html代码周围创建一个id为“testing”的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>