在模板中使用时，knockoutjs if 和 ifnot 绑定无法正常工作

Posted 2023-05-07

【中文标题】在模板中使用时，knockoutjs if 和 ifnot 绑定无法正常工作

【英文标题】：knockoutjs if and ifnot bindings are not working properly when used inside a template

【发布时间】：2012-12-10 15:18:34

【问题描述】：

我使用与敲除JS P>下面的模板

<tbody data-bind="foreach: List">
            <tr>
                <td><input type="button" data-bind="if: ($parent.IsFVL || $parent.AllowChat || $root.Me().AllowChatMonitoring), value: ID, click: SelectVisit" /><span data-bind="ifnot: ($parent.IsFVL || $parent.AllowChat || $root.Me().AllowChatMonitoring), text: ID"></span></td>...

和主叫/发起这样 P>的模板

<div data-bind="template:  name: 'tplVisitsGrid', data:  Title: 'My Visits', 'List': MVL, 'AllowChat': true, 'AllowPing': false, 'IsFVL': false  "></div>

另外我双重检查“$ root.Me（）。AllowChatMonitoring”的值是真实的，但两者的输入[类型=按钮]和跨度两者都呈现。我能怎么会丢失？ P>

【参考方案1】：

因为您将多个属性组合到if 和ifnot 中，所以您需要评估它们。试试这个（假设 IsFVL、AllowChat 和 AllowChatMonitoring 都是可观察的 - 它们必须是）：

<td><input type="button" data-bind="if: ($parent.IsFVL() || $parent.AllowChat() || $root.Me().AllowChatMonitoring()), value: ID, click: SelectVisit" /><span data-bind="ifnot: ($parent.IsFVL() || $parent.AllowChat() || $root.Me().AllowChatMonitoring()), text: ID"></span></td>...

之前实际发生的是比较 3 个函数，而不是函数的返回值。

【讨论】：

这些属性不是可观察的，因此您的建议将不起作用。

@ArtemVyshniakov 很好地让他们在If 绑定中工作，他们必须是可观察的

【参考方案2】：

您在访问 IsFVL、AllowChat 等时不应使用$parent。尝试将您的模板更新为以下内容：

<input type="button" data-bind="if: (IsFVL || AllowChat || $root.Me().AllowChatMonitoring), value: ID, click: SelectVisit" />
<span data-bind="ifnot: (IsFVL || AllowChat || $root.Me().AllowChatMonitoring), text: ID"></span></td>

如果这没有帮助，请解决您的问题。

【讨论】：

感谢回复，属性 IsFVL 和 AllowChat 不是 observables，之所以不让它们 observables 是因为我用这些属性的不同值加载模板 3 次，所以我不能找到一种方法将它们作为可观察的添加到我的模型中。通过我检查了其他简单的 javascript 表达式是否在淘汰绑定中进行了评估，例如 if、ifnot、visible 但这些 props 不是。我会为此创建一个小提琴并发布。