knockoutjs关于ko.bindingHandlers的updata订阅
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订阅的更多相关文章
- KnockoutJS 3.X API 第三章 计算监控属性(3) KO如何实现依赖追踪
KO是如何实现自动更新的 初学者可以掠过该篇,如果你是一个刨根问底的开发者,那本节将告诉你KO是如何实现依赖追踪和UI自动更新的. 其实很简单,KO的依赖追踪算法如下: 当你声明一个计算监控属性,KO ...
- 前端开发框架Bootstrap和KnockoutJS
江湖中那场异常惨烈的厮杀,如今都快被人遗忘了.当年,所有的武林同道为了同一个敌人都拼尽了全力,为数不多的幸存者心灰意冷,隐姓埋名,远赴他乡,他们将唯一的希望寄托给时间.少年子弟江湖老,红颜少女的鬓边也 ...
- JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案(一)
前言:出于某种原因,需要学习下Knockout.js,这个组件很早前听说过,但一直没尝试使用,这两天学习了下,觉得它真心不错,双向绑定的机制简直太爽了.今天打算结合bootstrapTable和Kno ...
- JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案(三):两个Viewmodel搞定增删改查
前言:之前博主分享过knockoutJS和BootstrapTable的一些基础用法,都是写基础应用,根本谈不上封装,仅仅是避免了html控件的取值和赋值,远远没有将MVVM的精妙展现出来.最近项目打 ...
- JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案(二)
前言:上篇 JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案(一) 介绍了下knockout.js的一些基础用法,由于篇幅的关系,所以只能分成两篇,望见谅!昨天就 ...
- MVVM架构~knockoutjs系列之从Knockout.Validation.js源码中学习它的用法
返回目录 说在前 有时,我们在使用一个插件时,在网上即找不到它的相关API,这时,我们会很抓狂的,与其抓狂,还不如踏下心来,分析一下它的源码,事实上,对于JS这种开发语言来说,它开发的插件的使用方法都 ...
- SpreadJS 中应用 KnockoutJS 技术
SpreadJS 支持 Knockout (KO)技术, KnockoutJS 是一个使用 MVVM 模式的 JavaScript 库,允许双向数据绑定,使数据和UI界面进行实时的交互更新.关于KO的 ...
- JS组件系列——KnockoutJS用法
前言:出于某种原因,需要学习下Knockout.js,这个组件很早前听说过,但一直没尝试使用,这两天学习了下,觉得它真心不错,双向绑定的机制简直太爽了.今天打算结合bootstrapTable和Kno ...
- BootstrapTable+KnockoutJS
BootstrapTable+KnockoutJS实现增删改查解决方案(三):两个Viewmodel搞定增删改查 前言:之前博主分享过knockoutJS和BootstrapTable的一些基础用 ...
随机推荐
- git 简单命令总结
一.本地仓库操作 1.构建本地仓库 初始化本地仓库,生成.git隐藏文件 $ git init 在文件夹内添加readme.md文件,执行如下命令,添加到本地仓库暂存区 $ git add readm ...
- ie请求缓存问题,页面内容没有及时更新
问题一:列表页面删除一条数据成功了,但页面上还有数据,再次点击删除,报错了... 问题二:一个点赞按钮,点击后发送一个请求,后台返回1或0 (点赞.取消点赞) ,谷歌浏览器功能正常,但在ie浏览器,后 ...
- JAVA基础--重新整理(1)后版
比较喜欢用demo来讲解. 变量: public static void main(String[] args) { int age;//变量声明 age = 16;//变量的初始化,第一次赋值 ag ...
- Java的赋值、浅克隆和深度克隆的区别
赋值 直接 = ,克隆 clone 假如说你想复制一个简单变量.很简单: int a= 5; int b= a; b = 6; 这样 a == 5, b == 6 不仅仅是int类型,其它七种原始数 ...
- Quartz.NET的简单任务管理类
昨天使用Quartz.NET做了个定时任务的功能,并实现了多个定时任务的功能 下面这个类实现了如下功能: 1.对定时任务进行管理 2.创建定时任务,需要给定时任务一个job的名称 3.判断给定的job ...
- CS231n官方笔记授权翻译总集篇发布
CS231n简介 CS231n的全称是CS231n: Convolutional Neural Networks for Visual Recognition,即面向视觉识别的卷积神经网络.该课程是斯 ...
- 第一个Quartz程序 (二)
1 我们使用maven项目 2 创建一个job类,在execute()方法里写上业务逻辑代码. 3 在另外一个类中创建触发器,调度器,并且绑定job. 首先在项目的pom.xml引入需要的jar包. ...
- Python机器学习笔记:不得不了解的机器学习面试知识点(1)
机器学习岗位的面试中通常会对一些常见的机器学习算法和思想进行提问,在平时的学习过程中可能对算法的理论,注意点,区别会有一定的认识,但是这些知识可能不系统,在回答的时候未必能在短时间内答出自己的认识,因 ...
- SQL Server 2008 management studio 无法连接到(local)解决方法
背景:安装VS2010之后,自带的 SQL Server 2008 Express 不具备management studio,于是下载了SQL Server 2008 Express 版本并全新安装 ...
- iview 刷新滞后于html问题
一.问题描述 每次刷新页面,下面的内容就会一闪而过. 一闪而过后恢复正常: 二.解决 问题代码: @*<span>修改密码</span>*@ @*<span>{{m ...