zoukankan      html  css  js  c++  java
  • 控制文本和外观------Attr Binding(attr属性绑定)

    Attr Binding(attr属性绑定)


    目的

    attr 绑定提供了一种方式可以设置DOM元素的任何属性值。你可以设置img的src属性,连接的href属性。使用绑定,当模型属性改变的时候,它会自动更新。

     

    例子

    <a data-bind="attr: { href: url, title: details }">
    Report
    </a>

    <script type="text/javascript">
    var viewModel = {
    url: ko.observable("year-end.html"),
    details: ko.observable("Report including final year-end statistics")
    };
    </script>

    呈现结果是该连接的href属性被设置为year-end.html, title属性被设置为Report including final year-end statistics。

     

    参数

        主参数

        该参数是一个JavaScript对象,属性是你的attribute名称,值是该attribute需要应用的值。

        如果参数是监控属性observable的,那随着值的变化将会自动添加或者删除该元素上的attribute值。如果不是,那attribute值将会只应用一次并且以后不在更新。

        其它参数

            无

     

    注:应用的属性名字不是合法的JavaScript变量命名

    如果你要用的属性名称是data-something的话,你不能这样写:

    <div data-bind="attr: { data-something: someValue }">...</div>

    … 因为data-something 不是一个合法的命名。解决方案是:在data-something两边加引号作为一个字符串使用。这是一个合法的JavaScript 对象 文字(从JSON技术规格说明来说,你任何时候都应该这样使用,虽然不是必须的)。例如,

    <div data-bind="attr: { ‘data-something’: someValue }">...</div>

     

    依赖性

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

    这个绑定可以用于给DOM元素添加自定义属性,或绑定到已有的属性:

    • 控制DOM元素的任意属性,比如href等
    • 会根据所绑定的bool值(或者可以返回bool值的js表达式),给元素 移除/添加 对应的属性
    • 如果与observable或者computed属性绑定,则会产生双向绑定效果。
  • 相关阅读:
    949. Largest Time for Given Digits
    450. Delete Node in a BST
    983. Minimum Cost For Tickets
    16. 3Sum Closest java solutions
    73. Set Matrix Zeroes java solutions
    347. Top K Frequent Elements java solutions
    215. Kth Largest Element in an Array java solutions
    75. Sort Colors java solutions
    38. Count and Say java solutions
    371. Sum of Two Integers java solutions
  • 原文地址:https://www.cnblogs.com/jinling/p/4738502.html
Copyright © 2011-2022 走看看