visible绑定(The "visible" binding)

对visible进行绑定可以控制元素的显示和隐藏。

示例：

<div data-bind="visible: shouldShowMessage">
    You will see this message only when "shouldShowMessage" holds a true value.
</div> 

<script type="text/javascript">
    var viewModel = {
        shouldShowMessage: ko.observable(true) // Message initially visible
    };
    viewModel.shouldShowMessage(false); // ... now it‘s hidden
    viewModel.shouldShowMessage(true); // ... now it‘s visible again
</script>

参数说明：

• Main parameter
• 当参数值是False时（包括数字0，或者null, undefined），绑定的元素会被设置style.display为none，元素隐藏。这会覆盖你写的其他样式。
• 当参数是true时（包括true, 非空对象或数组），绑定的元素style.display会被移除，元素可见。

如果绑定到visible的属性是observable的，则当值改变时，元素的可见或者隐藏也会动态的更改。如果绑定上的值不是observable的，那么只在第一次绑定时会生效，后面更改这个值是不会影响到元素的可见与否的。

• Add parameters
  • 无

注：使用函数和表达式控制元素的可见

也可以使用JS函数或者表达式来赋值，KO会根据函数或者表达式的值来动态的控制元素的显示和隐藏。

示例：

<div data-bind="visible: myValues().length > 0">
    You will see this message only when ‘myValues‘ has at least one member.
</div>

<script type="text/javascript">
    var viewModel = {
        myValues: ko.observableArray([]) // Initially empty, so message hidden
    };
    viewModel.myValues.push("some value"); // Now visible
</script>

依赖

无，除了Knockout的核心库外。