javascript - knockout html 绑定(bind)与内部的另一个绑定(bind)

Question

我正在使用 knockout 将内容动态加载到页面的各个部分，使用 HTML 绑定(bind)。

问题是我要绑定(bind)的 html 必须调用一个函数 onclick，我需要有关目标的信息和 knockout 轻松发送的数据。

是这样的:

myFunction($parent, $data)

HTML:

<table>
    <tbody data-bind="foreach: rows" >
        <tr>
            <td data-bind="html: rowValue">this will be a link</td>
        </tr>
   </tbody>
</table>

后来我将该值设置为一个链接，其中包含一个 knockout 绑定(bind):

rowValue("<a href='#' data-bind=click:alert('hello')" + result.Data + "</a>");

请检查fiddle here查看完整的工作代码。

您可以看到我写的两行之间的区别，如果我执行 javascript onclick 它会起作用，但显然 ko 缺少后期绑定(bind)。

我见过很多关于此的问题，但找不到一个有明确答案的问题。

我想用KO做这个，这个怎么实现？也许有模板？

Answer 1

KO 在您调用 ko.applyBindings 时应用绑定(bind)。因此，如果您在调用 applyBindings 之后修改 dom。 KO 不会意识到新的 dom 元素。

你可以这样使用模板:

<table>
    <tbody data-bind="foreach: sitesTable.rows" >
        <tr data-bind="foreach: row">
            <td data-bind="template: 'myTemplate' "></td>
        </tr>
    </tbody>
</table>

<br/>


<a href="#" onclick="getNewData()"> click here </a>
<script id="myTemplate" type="text/html">
    <a href='#' data-bind="html: cellValue, click: openAlert"> click </a>
</script>

由 Maurizio 编辑。使用此 fiddle 作为其他链接似乎已损坏: See fiddle