Question

非常简单的问题。

说我在我的视图中有这个HTML（）：

<a id="btnXYZ" class="" data-bind="click: editAction">Button</a>

如果点击则会执行editAction的简单锚标记。

现在，如果我有这样的事情：

<a id="btnXYZ" class="" data-bind="click: editAction, if: isOwner(ref)">Button</a>

假设isOwner(ref)评估为真，我看到锚没有文字。不好。

预期结果与之前相同（第一个例子）。

现在让我说我有这样的事情：

<div class="">
    <a id="btnX" class="" data-bind="click: editAction, if: isOwner(ref)">Button</a>
    <a id="btnY" class="" data-bind="click: editAction, if: isOwner(ref)">Button</a>
    <a id="btnZ" class="" data-bind="click: editAction, if: isOwner(ref)">Button</a>
</div>

与之前相同，如果isOwner（ref）求值为true，请参阅空锚标记。

问题：
如何绑定if: isOwner()来管理按钮可见性？

即。
如果isOwner(ref)评估为true我应该看到正确的链接/按钮
如果isOwner(ref)评估为false我将看不到任何链接/按钮

Answer 1

您可以使用virtual elements来实现这一目标：

<!-- ko if: isOwner(ref) -->
    <a id="btnXYZ" class="" data-bind="click: editAction">Button</a>
<!-- /ko -->

此外，如果你想要，你可以显示完全不同的东西，如：

<!-- ko ifnot: isOwner(ref) -->
    whatever you want
<!-- /ko -->

Answer 2

您想使用visible绑定。这将显示和隐藏整个元素，而if绑定只控制元素的内容。

此处a demo。

然而在这种情况下，我会使用@Vladimirs答案，因为你可以将虚拟元素包裹在所有3个按钮周围，而不是将它们全部单独绑定。

敲除if，click和visible binding

2 个答案: