kendo-ui - 我可以在剑道ui中进行条件绑定吗

Question

我需要将绑定应用到要出现在我的文档中的标记部分（并应用其数据绑定属性），只有当指定表达式的计算结果为真时。我尝试使用 slideUp/slideDown 和可见绑定来实现它。不同之处在于，使用 slideUp/slideDown，包含的标记始终保留在 DOM 中，并且始终应用其数据绑定属性 - 可见绑定仅使用 CSS 来切换容器元素的可见性。我想我需要在我的 DOM 中物理添加或删除包含的标记，并且只有在表达式为真时才将绑定应用于后代。任何人都可以提出解决这个问题的好方法。

Answer 1

据我了解，您想使用绑定修改 HTML。为此，您可以使用 HTML 绑定。举个例子：

<div id="example">
    <input type="checkbox" data-bind="checked: value"/>
    <div id="wrapper" data-bind="html: setHTML"></div>
    <br />
    value: <span data-bind="text: value"></span>
</div>

var viewModel = kendo.observable({
    value: false,
    name: "Jack",
    setHTML: function (e) {
        var flag = this.get("value"),
            html;
        if(flag) { //include the html
            html = '<input id="name" data-bind="value: name" />';
            return html;
        } else { //remove the html
            return "";
        }
    }
});
kendo.bind($("#example"), viewModel);

请注意，插入的 HTML 元素不会绑定到 View-Model。为此，您应该手动调用 kendo.bind。

kendo.bind($("#wrapper"), viewModel);

我希望这将解决方案适合您的情况。