【问题标题】:knockoutjs if and ifnot bindings are not working properly when used inside a template在模板中使用时,knockoutjs if 和 ifnot 绑定无法正常工作
【发布时间】: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>

【问题讨论】:

    标签: knockout.js knockout-2.0


    【解决方案1】:

    因为您将多个属性组合到ififnot 中,所以您需要评估它们。试试这个(假设 IsFVLAllowChatAllowChatMonitoring 都是可观察的 - 它们必须是):

    <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 不是。我会为此创建一个小提琴并发布。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-09-21
    • 2014-01-30
    • 1970-01-01
    • 2015-11-18
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多