ko.bindingHandlers是先执行init进行初始化数据的绑定（如果需要执行updata进行数据更新可以不用初始化）;

 init: function(element, valueAccessor) {

                     //初始化数据--然后执行updata进行需要更新数据的绑定，添加订阅

                     //如果在updata进行了数据的执行，init可以添加初始化事件

                     var value = valueAccessor(); // Get the current value of the current property we're bound to

                     $(element).text(value); // jQuery will hide/show the element depending on whether "value" or true or false

                 },

ko.bindinHandlers.init

在updata里面，才是订阅产生的时候，而不是在init的时候，数据就绑定了订阅；

 update: function(element, valueAccessor, allBindings) {

                     var value = ko.unwrap(valueAccessor()); //执行更新数据绑定，必须要执行一次否则无法确定添加订阅

                     //var value = valueAccessor()(); // Get the current value of the current property we're bound to

                     $(element).text(value);

                 }

ko.dindingHandlers.updata

完整代码如下：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

        <script type="text/javascript" src="js/jquery-2.1.0.js"></script>

        <script type="text/javascript" src="js/knockout-3.4.0.debug.js"></script>

        <script type="text/javascript">

            ko.bindingHandlers.slideVisible = {

                init: function(element, valueAccessor) {

                    //初始化数据--然后执行updata进行需要更新数据的绑定，添加订阅

                    //如果在updata进行了数据的执行，init可以添加初始化事件

                    var value = valueAccessor(); // Get the current value of the current property we're bound to

                    $(element).text(value); // jQuery will hide/show the element depending on whether "value" or true or false

                },

                update: function(element, valueAccessor, allBindings) {

                    var value = ko.unwrap(valueAccessor()); //执行更新数据绑定，必须要执行一次否则无法确定添加订阅

                    //var value = valueAccessor()(); // Get the current value of the current property we're bound to

                    $(element).text(value);

                }

            };

            var model = {

                te: ko.observable("ttttttttt"),

                aaa: function() {

                    this.te("aaaaaaaaaaaaaaaaaaaa");

                }

            }

            window.onload = function() {

                ko.applyBindings(model, document.body)

            }

        </script>

    </head>

    <body>

        <div data-bind="slideVisible:te"></div>

        <input type="button" value="aaaaaaaaa" data-bind="click:aaa" />

    </body>

</html>

ko.bindingHandlers.model

注：小七目前还是小白，写的博客为笔记类型的博客，是在项目中遇到的问题，仅用于学习。

　　涉及到原理部分还未做总结。

　　如果内容有不对、不全面或者其他的问题，欢迎大家纠正。

knockoutjs关于ko.bindingHandlers的updata订阅的更多相关文章

  1. KnockoutJS 3.X API 第三章 计算监控属性(3) KO如何实现依赖追踪

    KO是如何实现自动更新的 初学者可以掠过该篇,如果你是一个刨根问底的开发者,那本节将告诉你KO是如何实现依赖追踪和UI自动更新的. 其实很简单,KO的依赖追踪算法如下: 当你声明一个计算监控属性,KO ...

  2. 前端开发框架Bootstrap和KnockoutJS

    江湖中那场异常惨烈的厮杀,如今都快被人遗忘了.当年,所有的武林同道为了同一个敌人都拼尽了全力,为数不多的幸存者心灰意冷,隐姓埋名,远赴他乡,他们将唯一的希望寄托给时间.少年子弟江湖老,红颜少女的鬓边也 ...

  3. JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案（一）

    前言:出于某种原因,需要学习下Knockout.js,这个组件很早前听说过,但一直没尝试使用,这两天学习了下,觉得它真心不错,双向绑定的机制简直太爽了.今天打算结合bootstrapTable和Kno ...

  4. JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案（三）：两个Viewmodel搞定增删改查

    前言:之前博主分享过knockoutJS和BootstrapTable的一些基础用法,都是写基础应用,根本谈不上封装,仅仅是避免了html控件的取值和赋值,远远没有将MVVM的精妙展现出来.最近项目打 ...

  5. JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案（二）

    前言:上篇 JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案(一) 介绍了下knockout.js的一些基础用法,由于篇幅的关系,所以只能分成两篇,望见谅!昨天就 ...

  6. MVVM架构~knockoutjs系列之从Knockout.Validation.js源码中学习它的用法

    返回目录 说在前 有时,我们在使用一个插件时,在网上即找不到它的相关API,这时,我们会很抓狂的,与其抓狂,还不如踏下心来,分析一下它的源码,事实上,对于JS这种开发语言来说,它开发的插件的使用方法都 ...

  7. SpreadJS 中应用 KnockoutJS 技术

    SpreadJS 支持 Knockout (KO)技术, KnockoutJS 是一个使用 MVVM 模式的 JavaScript 库,允许双向数据绑定,使数据和UI界面进行实时的交互更新.关于KO的 ...

  8. JS组件系列——KnockoutJS用法

    前言:出于某种原因,需要学习下Knockout.js,这个组件很早前听说过,但一直没尝试使用,这两天学习了下,觉得它真心不错,双向绑定的机制简直太爽了.今天打算结合bootstrapTable和Kno ...

  9. BootstrapTable+KnockoutJS

    BootstrapTable+KnockoutJS实现增删改查解决方案(三):两个Viewmodel搞定增删改查   前言:之前博主分享过knockoutJS和BootstrapTable的一些基础用 ...

随机推荐

  1. Spring Cloud OAuth2.0 微服务中配置 Jwt Token 签名/验证

    关于 Jwt Token 的签名与安全性前面已经做了几篇介绍,在 IdentityServer4 中定义了 Jwt Token 与 Reference Token 两种验证方式(https://www ...

  2. js 获取浏览器大小，屏幕大小等。

    转自:“”http://www.cnblogs.com/top5/archive/2009/05/07/1452135.html“”..感谢,万分. 网页可见区域宽:document.body.cli ...

  3. python3中的range函数返回的是列表吗?

    注意,这里说的Python3里面的range函数,和Python2是不同的,返回的不是列表,是可迭代对象. 在python3中,如果执行下面的语句 print(range(10)) 得到结果是 ran ...

  4. jquery根据name属性查找元素

    $("div[id]") //选择所有含有id属性的div元素 $("input[name='newsletter']") //选择所有的name属性等于'ne ...

  5. JavaWeb学习 (十六)————JSP中的九个内置对象

    一.JSP运行原理 每个JSP 页面在第一次被访问时,WEB容器都会把请求交给JSP引擎(即一个Java程序)去处理.JSP引擎先将JSP翻译成一个_jspServlet(实质上也是一个servlet ...

  6. #15 time&datetime&calendar模块

    前言 从这一节开始,记录一些常用的内置模块,模块的学习可能比较无聊,但基础就在这无聊的模块中,话不多说,本节记录和时间相关的模块! 一.time模块 Python中设计时间的模块有很多,但是最常用的就 ...

  7. T-SQL:批GO使用实例（十四）

    批是由客户端应用程序作为一个单元发送给SQL Server 执行的一条或多条语句  如果批中出现错误就整个批都不会交给SQL SERVER 执行 PRINT '第一批';GO -- Invalid b ...

  8. 【WebSocket No.2】WebSocket和Socket实现聊天群发

    介绍: 前面写过一篇简单的websocke实现服务端.这一篇就不在说什么基础的东西主要是来用实例说话,主要是讲一下实现单聊和群组聊天和所有群发的思路设计. 直接不懂的可以看一下上一篇简单版本再来看也行 ...

  9. [PHP] 算法-数组中出现次数超过一半的数字的PHP实现

    数组中有一个数字出现的次数超过数组长度的一半,请找出这个数字.例如输入一个长度为9的数组{1,2,3,2,2,2,5,4,2}.由于数字2在数组中出现了5次,超过数组长度的一半,因此输出2.如果不存在 ...

  10. 【Redis】3、Redis集群部署

    Redis 集群是一个提供在多个Redis间节点间共享数据的程序集. Redis集群并不支持处理多个keys的命令,因为这需要在不同的节点间移动数据,从而达不到像Redis那样的性能,在高负载的情况下 ...