• Knockout 新版应用开发教程之"visible"绑定


    "visible" 绑定

    用途

    DOM元素的显示或者隐藏是根据绑定的值来的,前提是将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
        ko.applyBindings(viewModel);	
    </script>

    参数

    主要参数

    • 当这个参数是一个假值时(举例来说,布尔值的false , 数值0,或者null,或者undefined),绑定时候设置你的元素的style.display是none,从而使之隐藏起来。这个优先级要高于CSS中定义的
    • 当这个参数是一个真值时(举例来说,布尔值是true,或者非空对象与数组),绑定时候移除你display的值,从来显示出来

    注意:在CSS中你能配置任何display的风格(所以CSS的规则,比如display:table-row 在绑定之后也能很好的处理)

    如果参数是监控属性observable的,那元素的visible状态将根据参数值的变化而变化,如果不是,那元素的visible状态将只设置一次并且以后不在更新。

    • 附加参数:

    注意:用函数或者函数表达式去控制元素的可见性

    你也能用JavaScript函数或者任意的函数表达式作为一个参数值。

    如果你这样做,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
        ko.applyBindings(viewModel);
    </script>
    

    依赖:除KO核心类库外,无依赖。

  • 相关阅读:
    Log4NET初接触
    wwwww
    关于ASP.NET 的进程帐户对 IIS 元数据库读访问权问题
    CentOS8 .NET Core项目部署
    CentOS7.6中安装Apache及Apache常见操作和配置说明
    .net core 命令行下启动指定端口
    Centos7安装mongodb
    centos8+oracle19开机自启动
    计算机网络常用端口
    Centos7安装mongodb
  • 原文地址:https://www.cnblogs.com/aaronjs/p/3195611.html
Copyright © 2020-2023  润新知