applyBinding Observables

一般的数据绑定有三种:One-Time,One-Way,Two-way。

One-Time绑定模式的意思即为从viewModel绑定至UI这一层只进行一次绑定,程序不会继续追踪数据的在两者中任何一方的变化,这种绑定方式很使用于报表数据,数据仅仅会加载一次。

One-Way绑定模式即为单向绑定,即object-UI的绑定,只有当viewModel中数据发生了变化,UI中的数据也将会随之发生变化,反之不然。

Two-Way绑定模式为双向绑定,无论数据在Object或者是UI中发生变化,应用程序将会更新另一方,这是最为灵活的绑定方式,同时代价也是最大的。数据绑定只是作为元素的自定义属性写上标签内,并不能决定它是何种绑定。

如果值是通过ko.observable定义的说明是双向绑定,否则为One-Time绑定,在knockout不存在单向绑定。

applyBindings

隐藏代码// Knockout调用applyBindings激活myViewModel(即把myViewModel和View中的声明式绑定data-bind接洽关系起来) 
ko.applyBindings(myViewModel); 
// 限制只在指定对象someElementId和后代节点中进行激活操纵。 
ko.applyBindings(myViewModel, document.getElementById(""someElementId"")); 
personName: ko.observable(""Bob""), 
// 静态绑定
The name is <span data-bind="text: personName"></span> 

Observables

并不是所有的浏览器都支撑JavaScript的getters和setters办法(IE),是以从兼容性推敲,ko.observable是function。

读取observable属性:myViewModel.personName()

设置observable属性:myViewModel.personName(""Mary"")

同时设置多个observable属性:myViewModel.personName(""Mary"").personAge(50) 链式语法

隐藏代码// 动态绑定(主动订阅,作废订阅)
var subscription = myViewModel.personName.subscribe(function(newValue) { /* do stuff */ });
// ...then later...
subscription.dispose(); // I no longer want notifications// Computed Observablesthis.fullName = ko.computed(function() {return this.firstName() + " " + this.lastName();}, this);var myObservableArray = ko.observableArray();    // Initially an empty array
myObservableArray.push(""Some value"");            // Adds the value and notifies observers// 初始化绑定命组
// This observable array initially contains three objects
var anotherObservableArray = ko.observableArray([{ name: "Bungle", type: "Bear" },{ name: "George", type: "Hippo" },{ name: "Zippy", type: "Unknown" }
]);// 自定义排序
myObservableArray.sort(function(left, right) { return left.lastName == right.lastName ? 0 : (left.lastName < right.lastName ? -1 : 1) })// 可写的依附属性 --- 数字主动格局化显示,保存值时移除无关逗号
function MyViewModel() {this.price = ko.observable(25.99);this.formattedPrice = ko.computed({read: function () {return ""¥"" + this.price().toFixed(2);},write: function (value) {// Strip out unwanted characters, parse as float, then write the raw data back to the underlying "price" observablevalue = parseFloat(value.replace(/[^.d]/g, ""));this.price(isNaN(value) ? 0 : value); // Write to underlying storage},owner: this});
}ko.applyBindings(new MyViewModel());

Writeable computed observables可写的依附属性(FirstName 和 FullName彼此换算,数字主动格局化显示)

ko.dependentObservable(Knockout 2.0中新增长的办法,和ko.computed等价,然则加倍便利懂得应用)

Observable Arrays

observableArray :跟踪的是数组中的对象,而不是对象的状况。即observableArray 仅跟踪它拥有的对象,

并且在对象被添加或者删除的时辰,通知listeners

。要监控对象的属性变更,须要编写自力的代码。 因为observableArray()办法放回的是一个数组,是以从技巧上来说,任何Javascript关于数组操纵的原生办法都能直接应用。

然则基于下述来由,凡是推荐应用KO中的等价办法:

1,KO中的办法支撑所有主流浏览器(比如,Javascript原生办法indexOf在<=IE8时不正常,而KO的indexOf 能正常工作)

2,dependency tracking

3,语法加倍简洁:调用KO中的办法应用myObservableArray.push(...),调用原生Javascript中的办法应用myObservableArray().push(...)

具体每个办法参考下面链接中的文档

observableArray 排序:默认对字符串用字母排序,对数字用数值排序。可以自定义排序办法:参考代码块中的代码

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/439277.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【git学习】统计git项目某user的代码量

查看自己的代码量&#xff1a;&#xff08;直接awk编程&#xff09; git log --author"username" --prettytformat: --numstat | awk { add $1; subs $2; loc $1 - $2 } END { printf "added lines: %s, removed lines: %s, total lines: %s\n", add, …

一步步编写操作系统 79 在c代码中内联汇编

基本内联汇编是最简单的内联形式&#xff0c;其格式为&#xff1a; asm [volatile] (“assembly code”) 各关键字之间可以用空格或制表符分隔也可以紧凑挨在一起不分隔&#xff0c;各部分意义如下&#xff1a; 关键字asm用于声明内联汇编表达式&#xff0c;这是内联汇编固定…

LeetCode 237. 删除链表中的节点(思维)

请编写一个函数&#xff0c;用于 删除单链表中某个特定节点 。在设计函数时需要注意&#xff0c;你无法访问链表的头节点 head &#xff0c;只能直接访问 要被删除的节点 。 题目数据保证需要删除的节点 不是末尾节点 。 https://leetcode-cn.com/problems/delete-node-in-a-…

一步步编写操作系统80 扩展内联汇编1

由于基本内联汇编功能太薄弱了&#xff0c;所以才对它进行了扩展以使其功能强大。不过&#xff0c;易用性往往与功能强弱是成正比的&#xff0c;如您所料&#xff0c;扩展内联汇编确实有点难&#xff0c;但在求知欲的驱使下&#xff0c;就让咱们痛并快乐着吧。 gcc本身是个c编…

LeetCode 397. 整数替换

题目大意&#xff1a; 给定一个正整数 n &#xff0c;你可以做如下操作&#xff1a; 如果 n 是偶数&#xff0c;则用 n / 2替换 n 。 如果 n 是奇数&#xff0c;则可以用 n 1或n - 1替换 n 。 n 变为 1 所需的最小替换次数是多少&#xff1f; 链接&#xff1a;https://leet…

一步步编写操作系统81 att内嵌汇编语法

内联汇编的格式也变得让人生畏了&#xff0c;感觉既不像C语言&#xff0c;也不像汇编语言&#xff0c;似乎是一种中间产物&#xff0c;不信您看&#xff1a; asm [volatile] (“assembly code” : output : input : clobber/modify) 和前面的基本内联汇编相比&#xff0c;扩展…

LeetCode 375. 猜数字大小 II

题目大意&#xff1a; https://leetcode-cn.com/problems/guess-number-higher-or-lower-ii 我们正在玩一个猜数游戏&#xff0c;游戏规则如下&#xff1a; 我从 1 到 n 之间选择一个数字。 你来猜我选了哪个数字。 如果你猜到正确的数字&#xff0c;就会 赢得游戏 。 如果你…

【转】2.3SharePoint服务器端对象模型 之 访问网站和列表数据(Part 3)

&#xff08;三&#xff09;视图 与传统意义上的数据视图类似&#xff0c;SharePoint中的列表视图指定了列表中数据的筛选条件、排序条件、分组条件、显示栏/字段、显示条目数、显示样式等内容。在SharePoint中&#xff0c;使用SPView表示列表视图&#xff0c;使用SPViewColle…

LeetCode 598. 范围求和 II

https://leetcode-cn.com/problems/range-addition-ii 题目大意 给定一个初始元素全部为 0&#xff0c;大小为 m*n 的矩阵 M 以及在 M 上的一系列更新操作。 操作用二维数组表示&#xff0c;其中的每个操作用一个含有两个正整数 a 和 b 的数组表示&#xff0c;含义是将所有符…

【转】2.4SharePoint服务器端对象模型 之 访问网站和列表数据(Part 4)

&#xff08;四&#xff09;栏/字段 SharePoint中的字段&#xff08;中文版中叫做“栏”&#xff09;与传统的数据栏类似&#xff0c;也有不同类型的区别&#xff0c;不过SharePoint中内置的栏类型除了按照数据类型&#xff08;如数字、日期和时间等&#xff09;进行区分之外&…

【转】2.5SharePoint服务器端对象模型 之 访问网站和列表数据(Part 5)

&#xff08;五&#xff09;列表条目&#xff08;SPListItem&#xff09; SharePoint中数据的存储基本上都是通过列表条目来完成&#xff08;文档库中的文档也是一种特殊的列表条目&#xff09;&#xff0c;因此在SharePoint应用开发中&#xff0c;最终是要和列表条目打交道的…

【转】3.1SharePoint服务器端对象模型 之 访问文件和文件夹(Part 1)

本节中所阐述的内容&#xff0c;主要适用于SharePoint文档库中的文件和文件夹&#xff0c;以及列表中的文件夹。系统中的其他文件&#xff08;如_layouts中的文件、配置文件、程序文件等&#xff09;不在本章节的讨论范围之内。 &#xff08;一&#xff09;概述 SharePoint的文…

电影与爆米花(模拟)

题目大意&#xff1a; n个人是朋友&#xff0c;他们坐在一排去看电影&#xff0c;相邻的最多三个人可以吃同一桶爆米花。每个人都想迟到爆米花&#xff0c;问最少需要几桶爆米花&#xff1f; 输入&#xff1a;一个数组&#xff0c;代表这n个人每个人选择的座位号。 输出&…

【转】3.2SharePoint服务器端对象模型 之 访问文件和文件夹(Part 2)

4、添加文件夹 文件夹的创建方法在文档库和普通列表中稍有不同。 在文档库中&#xff0c;与一般的集合操作相同&#xff0c;直接使用SPFolderCollection的Add(string name)方法即可添加文件夹&#xff0c;例如下面的程序在文档库的根目录中添加一个名为“技术文档”的子文件夹…

【分治】01串

在第一行我们写上一个0。接下来的每一行&#xff0c;将前一行中的0替换为01&#xff0c;1替换为10。 给定行数N和序数K&#xff0c;返回第N行中第K个字符。&#xff08;K从1开始&#xff09; 输入格式: 输入在一行中给出2个整数N和K。 N的范围[1,30] K的范围[1,2(N−1)] 输出…

【转】3.3SharePoint服务器端对象模型 之 访问文件和文件夹(Part 3)

&#xff08;三&#xff09;遍历 文件系统的遍历是指按照文件夹的层级结构遍历文档库、列表的文件夹和列表条目。遍历主要有三种方式&#xff1a;&#xff08;1&#xff09;直接使用文件系统对象模型进行遍历&#xff1b;&#xff08;2&#xff09;使用SPDocumentLibrary进行遍…

【思维构造】跳跃游戏

题干&#xff1a; 有一种跳跃游戏&#xff1a;假设初始位置在数轴的原点处&#xff0c;每一次可以选择两种操作&#xff1a; 向前k步或向后一步&#xff08;k为当前的移动次数&#xff0c;即第k次跳跃k步&#xff09;。给定一个终点D&#xff08;D>0&#xff09;&#xff0…

【LeetCode-581】最短无序连续子数组

给你一个整数数组 nums &#xff0c;你需要找出一个 连续子数组 &#xff0c;如果对这个子数组进行升序排序&#xff0c;那么整个数组都会变为升序排序。 请你找出符合题意的 最短 子数组&#xff0c;并输出它的长度。 示例 1&#xff1a; 输入&#xff1a;nums [2,6,4,8,10…

【转】3.4SharePoint服务器端对象模型 之 访问文件和文件夹(Part 4)

&#xff08;四&#xff09;列表附件 列表的附件也是文件系统的一部分&#xff0c;它依附于普通列表的列表条目之上&#xff08;文档库没有附件&#xff09;&#xff0c;它的操作在一些地方和文档库中文档的操作非常类似。 1、附件的读取 一个列表条目的附件可以使用SPListIt…

【LeetCode160】相交链表

给你两个单链表的头节点 headA 和 headB &#xff0c;请你找出并返回两个单链表相交的起始节点。如果两个链表不存在相交节点&#xff0c;返回 null 。 图示两个链表在节点 c1 开始相交&#xff1a; 题目数据 保证 整个链式结构中不存在环。 注意&#xff0c;函数返回结果后…