希望基于真假条件可以看到div

Question

我在页面中使用knockout来显示其他元素。我希望div只有在用户是管理员时才会显示无样式。

 <div data-bind="display: !isCurrentUserAnAdmin" class="slidingDiv" style="display:none">

我在页面中使用knockout来确定登录用户是否是管理员。这是否可以在div元素上使用data-bind？

Answer 1

theres no＆＃34; display＆＃34;绑定，它是一个＆＃34;可见＆＃34;捆绑。所以像：

<div data-bind="visible: !isCurrentUserAnAdmin()" class="slidingDiv" style="display:none"> 

转换为＆＃34;如果!isCurrentUserAnAdmin()为真，则此div可见

ps，在data-bind中，如果您想要isCurrentUserAnAdmin的值，则需要放置()，如果它是可观察的

关于可见绑定的

敲门文档：http://knockoutjs.com/documentation/visible-binding.html

Answer 2

两个简单的说明：

1. 如果你想通过使用knockout visible绑定来控制元素的可见性，你不应该应用任何可以干扰它的样式，即你应该从div中删除style="display:none"

2. observables是必须进行评估才能获得其价值的函数。当您指定表达式tha在ko绑定中返回observable时，ko会检测它并自动解除该值。因此，此绑定可行：visible: isCurrentUserAnAdmin，因为isCurrentUserAnAdmin是可观察的。但是，如果绑定表达式返回的内容不是可观察的，则表达式按原样求值。因此，当评估此绑定时：visible: !isCurrentUserAnAdmin，visible总是变为false，因为isCurrentUserAnAdmin返回function，这是truish值，当被!否定时{1}}变为false。因此，您必须手动提取包括括号的值，即visible: !isCurrentUserAnAdmin()。这是新ko用户最常见的错误。 *注意：另一个典型的错误是访问这样的可观察的子属性：parent.childProperty，这是未定义的（可观察的函数不包含childProperty）。在这种情况下，您可以使用parent().childProperty，它返回一个自动解包的observable，或parent().childProperty()直接提取可观察值。

关于第二点，您可以在viewmodel中包含计算的observable，以避免在客户端评估它。像这样：

this.adminVisible = ko.computed(function() { return !isCurrentUserAnAdmin(); }, this);

然后您的绑定将是：visible: adminVisible。我更喜欢使用计算的observable，因为它们不易出错，更易测试，并且绑定变得更加清晰。