zoukankan      html  css  js  c++  java
  • knockout 学习实例6 attr

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="js/knockout-3.4.0.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body>
    <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")
        };
        ko.applyBindings(viewModel)
    </script>
     
    </body>
    </html>

    如果属性绑定 data-sonmeth 和css的绑定一样,也需要加入 引号 'data-sonmeth'

    下面的会报错

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="js/knockout-3.4.0.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body>
    <div data-bind="attr: { data-something: someValue }">...</div>
    
     
    <script type="text/javascript">
        var viewModel = {
            someValue: ko.observable("{name:'data-something'}"),
           
        };
        ko.applyBindings(viewModel)
    </script>
     
    </body>
    </html>

    下面的时正常的

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="js/knockout-3.4.0.js" type="text/javascript" charset="utf-8"></script>
    </head>
    <body>
    <div data-bind="attr: { 'data-something': someValue }">...</div>
    
     
    <script type="text/javascript">
        var viewModel = {
            someValue: ko.observable("{name:'data-something'}"),
           
        };
        ko.applyBindings(viewModel)
    </script>
     
    </body>
    </html>
  • 相关阅读:
    建设是为“有” 共享是为“无”
    设计模式-命令模式
    设计模式-建造者模式
    设计模式-抽象工厂模式(升级版工厂方法模式)
    设计模式-原型模式
    设计模式-单例模式
    Java中的多维数组
    设计模式-装饰者
    设计模式-模板方法
    乐观锁与悲观锁
  • 原文地址:https://www.cnblogs.com/tongchuanxing/p/5654723.html
Copyright © 2011-2022 走看看