KnockoutJS 3.X API 第五章 高级应用(4) 自定义处理逻辑
在典型的Knockout应用程序中,DOM元素是动态添加和删除的,例如使用模板绑定或通过控制流绑定(if,ifnot,with和foreach)。 当创建自定义绑定时,通常需要添加清除逻辑,当Knockout删除与您的自定义绑定相关联的元素时,该逻辑运行。
在处理元素时注册回调
要注册要删除节点时要运行的函数,可以调用ko.utils.domNodeDisposal.addDisposeCallback(node,callback)。 例如,假设您创建自定义绑定以实例化窗口小部件。 当具有绑定的元素被删除时,您可能想要调用窗口小部件的destroy方法:
ko.bindingHandlers.myWidget = {
init: function(element, valueAccessor) {
var options = ko.unwrap(valueAccessor()),
$el = $(element);
$el.myWidget(options);
ko.utils.domNodeDisposal.addDisposeCallback(element, function() {
// This will be called when the element is removed by Knockout or
// if some other part of your code calls ko.removeNode(element)
$el.myWidget("destroy");
});
}
};
覆盖外部数据的清理
当删除一个元素时,Knockout运行逻辑来清理与该元素相关的任何数据。 作为这个逻辑的一部分,如果jQuery在页面中加载,Knockout调用jQuery的cleanData方法。 在高级方案中,您可能希望阻止或自定义在应用程序中如何删除此数据。 Knockout公开了一个函数,ko.utils.domNodeDisposal.cleanExternalData(node),可以重写以支持自定义逻辑。 例如,为了防止调用cleanData,可以使用空函数来替换标准的cleanExternalData实现:
ko.utils.domNodeDisposal.cleanExternalData = function () {
// Do nothing. Now any jQuery data associated with elements will
// not be cleaned up when the elements are removed from the DOM.
};
KnockoutJS 3.X API 第五章 高级应用(4) 自定义处理逻辑的更多相关文章
- KnockoutJS 3.X API 第五章 高级应用(3) 虚拟元素绑定
注意:这是一种高级技术,通常仅在创建可重用绑定的库时使用. 这不是你通常需要做的时候使用Knockout构建应用程序. Knockout的控制流绑定(例如,if和foreach)不仅可以应用于常规DO ...
- KnockoutJS 3.X API 第五章 高级应用(5) 使用预处理扩展Knockout绑定语法
注意:这是一种高级技术,通常仅在创建可重用绑定或扩展语法的库时使用. 这不是你通常需要做的时候使用Knockout构建应用程序. 从Knockout 3.0开始,开发人员可以通过提供在绑定过程中重写D ...
- KnockoutJS 3.X API 第五章 高级应用(2) 控制后代绑定
注意:这是一种高级技术,通常仅在创建可重用绑定的库时使用. 默认情况下,绑定仅影响它们应用到的元素. 但是如果你想影响所有的后代元素呢? 为此,只需从绑定的init函数中返回{controlsDesc ...
- KnockoutJS 3.X API 第五章 高级应用(1) 创建自定义绑定
您不仅限于使用内置的绑定,如click,value绑定等,您可以创建自己的绑定. 这是如何控制视图模型如何与DOM元素进行交互,并且为您提供了大量的灵活性,以便于以复用的方式封装复杂的行为. 注册绑定 ...
- KnockoutJS 3.X API 第四章(13) template绑定
目的 template绑定(模板绑定)使用渲染模板的结果填充关联的DOM元素. 模板是一种简单方便的方式来构建复杂的UI结构 . 下面介绍两种使用模板绑定的方法: 本地模板是支持foreach,if, ...
- KnockoutJS 3.X API 第六章 组件(5) 高级应用组件加载器
无论何时使用组件绑定或自定义元素注入组件,Knockout都将使用一个或多个组件装载器获取该组件的模板和视图模型. 组件加载器的任务是异步提供任何给定组件名称的模板/视图模型对. 本节目录 默认组件加 ...
- KnockoutJS 3.X API 第三章 计算监控属性(5) 参考手册
计算监控属性构造参考 计算监控属性可使用以下形式进行构造: ko.computed( evaluator [, targetObject, options] ) - 这种形式是创建一个计算监控属性最常 ...
- KnockoutJS 3.X API 第四章 数据绑定(5) 控制流component绑定
本节目录: 一个例子 API 备注1:仅模板式的component 备注2:component虚拟绑定 备注3:传递标记到component绑定 内存管理 一个例子 First instance, w ...
- KnockoutJS 3.X API 第七章 其他技术(7) 微任务
注意:本文档适用于Knockout 3.4.0及更高版本. Knockout的微任务队列 Knockout的微任务队列支持调度任务尽可能快地运行,同时仍然是异步的,努力安排它们在发生I / O,回流或 ...
随机推荐
- c++中的指针
指针用起来是一把利器,但用得不好的童鞋 无异于 火上浇油 ,下面笔者将自己学习 的一点小小心得,与君共享 指针在类中 1.对象指针 初始化 Point a(4,5); Point *p1 = & ...
- javascript基础知识-类和模块
在JavaScript中可以定义对象的类,让每个对象都共享这些属性. 在JavaScript中,类的实现是基于其原型继承机制的.如果两个实例都从同一个原型对象上继承了属性,我们就说它们是同一个类的实例 ...
- iOS开发零基础--Swift教程 可选类型
可选类型的介绍 注意: 可选类型时swift中较难理解的一个知识点 暂时先了解,多利用Xcode的提示来使用 随着学习的深入,慢慢理解其中的原理和好处 概念: 在OC开发中,如果一个变量暂停不使用,可 ...
- Flask的socket.error:10053
一脸懵逼: 学习python一段时间,最近使用flask搭建了一个服务器,然后使用phantom(相当于浏览器)发送请求发送了几条flask就挂掉了,报错信息如下: 由于个人python经验不是很足, ...
- 《理解 ES6》阅读整理:函数(Functions)(七)Block-Level Functions
块级函数(Block-Level Functions) 在ES3及以前,在块内声明一个函数会报语法错误,但是所有的浏览器都支持块级函数.不幸的是,每个浏览器在支持块级函数方面都有一些细微的不同的行为. ...
- Android 环境搭建
一.Android 环境搭建 开发工具: Android Studio(开发工具,前提是先装 java JDK) 下载地址:http://www.androiddevtools.cn/ Oracl ...
- Encrypt
begin#BE37F2FB34350DCA6242ADC91F33FA9ABDB6F502F5CA07E3D0CE0C3FAF8799AB3F4622564487B3729F111D9E132A08 ...
- Django如何搭建服务器
建立django站点: 新建Django项目,我这里是使用命令创建项目的. django-admin startproject HelloDjango 创建HelloDjango项目 然后进入到He ...
- 记一次Redis和NetMQ的测试
Redis是一个高速缓存K-V数据库,而NetMQ是ZeroMQ的C#实现版本,两者是完全不同的东西. 最近做游戏服务器的时候想到,如果选择一个组件来做服务器间通信的话,ZeroMQ绝对是一个不错的选 ...
- Android(5)— Mono For Android 两个功能型外包
0.前言 距上一篇博文貌似很久了,其中原因种种,归根结底是自己没有坚持好,没有静下心来归纳总结,希望从这一刻起每个月坚持写两篇.(哈哈,突然想起老师说起一句话, 晚上在被窝里悄悄发誓好好学习,第二天涛 ...