Question

我正在学习Knockout.js并使用with:binding更改绑定上下文，如下所示：

HTML：

<div id="wrap" data-bind="with: currentCat()">

    <h2 data-bind="text: name"></h2>
    <h3 data-bind="text: level"></h3>
    <div data-bind="text: count"></div>
    <img src="" alt="cute cat" data-bind="click: $parent.incrementCounter, attr: {src: imgSrc}">

</div>

使用Javascript：

var cat = function() {
    this.name = ko.observable("Fossie");
    this.imgSrc = ko.observable("--");
    this.count = ko.observable(0);
    this.nicknames = ko.observableArray(["Meow", "Johnny"]);
};

var viewModel = function() {

    this.currentCat = ko.observable(new cat());
    this.incrementCounter = function() {
        this.currentCat().count(this.currentCat().count() + 1);
    }

};
ko.applyBindings(new viewModel());

当我点击图片时，我收到此错误：

Uncaught TypeError: this.currentCat is not a function

相同的代码在不使用with绑定的情况下工作。任何人都可以解释一下我改变背景后发生的变化吗

Answer 1

this在用作事件处理程序时会丢失其上下文。使用.bind

this.incrementCounter = function() {
    this.currentCat().count(this.currentCat().count() + 1);
}.bind(this);

淘汰赛：XXX不是功能错误

1 个答案: