Knockout.js 在Durandal/knockout中将单击绑定添加到现有视图/视图模型

我正在使用第三方图表工具生成图例，并在该图例中使标签可点击。它使用回调函数生成标签

function legendLabelFormatter(label, series) {
    var linkHTML = '<a href="#" data-bind="click: drillDown(' + seriesIndex + '), clickBubble: false;">' + label + '</a>';
    seriesIndex += 1;
    return linkHTML;
}

…因为这会产生一个可点击的标签

在我的“附加”活动中，我有：

    $(view).on('click', 'a.legendLabel', function (e) {
        this.drillDown(this.seriesIndex);
    });

我不确定您在事件处理程序中通过递增

seriesIndex

试图实现什么？它只允许我识别点击了哪个标签。Flot将调用legendLabelFormatter函数五次-有5组数据要绘制）

seriesIndex

只是我设置的一个局部全局变量，它与图表中使用的viewmodel或dataset无关

因此，

this.serieIndex

根本不存在，因为在附加函数中引用的点上，

this

肯定只是单击的链接？我尝试在链接中添加“seriesIndex”作为属性，但是当我在函数被点击时检查

这个

对象时，它仍然没有显示出来，所以我还没有完全正确地理解它

编辑2（和答案） 而埃里克·泰勒的回答很有帮助，而且几乎达到了目的。在这个问题上，任何像我这样迟钝的人都可能会被它难住，所以为了完整起见：

jquery图表插件调用此函数作为其标签格式化例程的一部分（在我的例子中，调用了5次，因为我有5个数据要显示在图表上）

---

这成功地调用了我的“向下搜索”函数，并单击了标签的索引，因此我可以使用它在该函数中加载正确的数据数组。

您将无法动态添加数据绑定。但是，你不需要这样做

这是委派活动的理想候选者。请看一下淘汰文档

将

linkHTML

更改为以下内容：

var linkHTML = '<class='label' href='#'>'

或者类似的东西

表达上述内容的更好方式是：

$(view).on('click', 'a.label', function (e) {
    this.drillDown(this.seriesIndex);
    seriesIndex++;
});

我更喜欢后者，因为它利用了附加处理程序上可用的“视图”：

attached = function(view) {
    $(view).on('click', 'a.label', function (e) {
        this.drillDown(this.seriesIndex);
        seriesIndex++;
    });
}

---

委托方法的优点在于，您可以动态添加标签，并且由于事件附加到tag.class，jQuery将根据事件选择新标签。

谢谢。虽然还没有完全做到这一点-请参阅原始帖子中的“编辑1”！请注意：虽然这被标记为答案，但在我写这篇评论时，Eric的答案并不是很完整，所以请参阅我原始帖子中的“编辑2”以获得更全面的图片。我很高兴你能成功。我在你最初的帖子中没有足够的代码继续写下去，但我觉得委托的方法是最好的……就目前而言。但是@Simon LaVasseur是正确的：定制的敲除绑定最终将是最好的。但我建议在重构到自定义绑定之前，再进一步。首先给你的应用程序一个机会与你对话。你应该将你的jQuery插件包装在自定义绑定中，并让自定义绑定在init调用结束时使用applyBindings。

var linkHTML = '<class='label' href='#'>'

$(".label").click(function () {
    this.drillDown(this.seriesIndex);
    seriesIndex++;
});

$(view).on('click', 'a.label', function (e) {
    this.drillDown(this.seriesIndex);
    seriesIndex++;
});

attached = function(view) {
    $(view).on('click', 'a.label', function (e) {
        this.drillDown(this.seriesIndex);
        seriesIndex++;
    });
}