Kendo MVVM 数据绑定(六) Html
Kendo MVVM 数据绑定(六) Html
Html 绑定可以使用 ViewMod e 的属性来设置 DOM 元素的 innerHTML 属性。如果 ViewModel 的属性的数据类型不是字符串,比如(Text, Number 或者 Date),那么会调用 toString() 方法,将这些值转为字符串。注意:如果需要设置 input,textarea 或是 select 的值,需要使用 value 绑定。例如:
<span data-bind="html: name"></span>
<script>
var viewModel = kendo.observable({
name: "John Doe"
}); kendo.bind($("span"), viewModel);
</script>
这个结果显示如下 html 元素:<span>John Doe</span>
如果 ViewModel 的值包含 HTML 标记,这些标记和作为最后结果显示出来,比如:
<span data-bind="html: name"></span>
<script>
var viewModel = kendo.observable({
name: "<strong>John Doe</strong>"
}); kendo.bind($("span"), viewModel);
</script>
显示如下:
John Doe
如果只想显示 ViewModel 的值,可以使用 text 绑定。
Kendo MVVM 数据绑定(六) Html的更多相关文章
- Kendo UI开发教程(16): Kendo MVVM 数据绑定(五) Events
本篇和Kendo UI开发教程(14): Kendo MVVM 数据绑定(三) Click类似,为事件绑定的一般形式.Events绑定支持将ViewModel的方法绑定到DOM元素的事件处理(如鼠标事 ...
- Kendo MVVM 数据绑定(十一) Value
Kendo MVVM 数据绑定(十一) Value Value 绑定可以把 ViewModel 的某个属性绑定到 DOM 元素或某个 UI 组件的 Value 属性.当用户修改 DOM 元素或 UI ...
- Kendo MVVM 数据绑定(十) Source
Kendo MVVM 数据绑定(十) Source Source 绑定可以把 ViewModel 的值和由 Kendo 模板定义的目标元素绑定,如果 ViewModel 的值发生变化,被绑定的目标元素 ...
- Kendo MVVM 数据绑定(九) Text
Kendo MVVM 数据绑定(九) Text Text 绑定可以使用 ViewModel 来设置 DOM 元素的文本属性,如果需要设置 input,textarea,或 select 的显示,需要使 ...
- Kendo MVVM 数据绑定(八) Style
Kendo MVVM 数据绑定(八) Style Style 绑定可以通过 ViewModel 绑定到 DOM 元素 CSS 风格属性,例如: <span data-bind="sty ...
- Kendo MVVM 数据绑定(七) Invisible/Visible
Kendo MVVM 数据绑定(七) Invisible/Visible Invisible/Visible 绑定可以根据 ViewModel 的某个属性来显示/隐藏 DOM 元素.例如: <d ...
- Kendo MVVM 数据绑定(五) Events
Kendo MVVM 数据绑定(五) Events 本篇和 Kendo MVVM 数据绑定(三) Click 类似,为事件绑定的一般形式.Events 绑定支持将 ViewModel 的方法绑定到 D ...
- Kendo MVVM 数据绑定(四) Disabled/Enabled
Kendo MVVM 数据绑定(四) Disabled/Enabled Disabled 和 Enabled 绑定可以根据 ViewModel 的某个属性值的 true,false 来设置 DOM 元 ...
- Kendo MVVM 数据绑定(三) Click
Kendo MVVM 数据绑定(三) Click Click 绑定可以把由 ViewModel 定义的方法不绑定到目标 DOM 的 click 事件.当点击目标 DOM 元素时触发 ViewModel ...
随机推荐
- poj3208启示录——数位DP
题目:http://poj.org/problem?id=3208 数位DP,首先按位数预处理出每一种位数的情况,包括有多少个魔鬼数和有多少个以6开头的非魔鬼数,以便递推.累加等等: 然后先找出第X个 ...
- IHE-PIX 备注
IHE给出了各个Actor之间如何通讯的建议: 1. 应用程序通讯时必须用MLLP包装或者解析. 2. 客户端建立连接后,服务器端必须用此连接进行应答.客户端可以继续用此连接启 ...
- js实现星级评分之方法一
利用一个星级评分的小案例,来逐步封装js星级评分插件. 从最基础的js知识,通过一个小的demo,逐步学习js的面向对象知识. 从浅到深,逐步递进. 图片素材 <!DOCTYPE html> ...
- JAVA基础学习-集合三-Map、HashMap,TreeMap与常用API
森林森 一份耕耘,一份收获 博客园 首页 新随笔 联系 管理 订阅 随笔- 397 文章- 0 评论- 78 JAVA基础学习day16--集合三-Map.HashMap,TreeMap与常用A ...
- POJ 2387 Til the Cows Come Home Dijkstra求最短路径
Til the Cows Come Home Bessie is out in the field and wants to get back to the barn to get as much s ...
- 如何升级一个JavaWeb应用
准备db变更 准备整个war包或变更的文件 上传文件至云盘(通常直接上传文件较慢,建议先传到云盘,然后下载) 从云盘下载 执行db变更 解压war到指定目录或替换变更的文件 修改设计IP地址的配置文 ...
- Eclipse与IntelliJ IDEA区别
1.没有workspace,新增modules(Workspace-Project,Project-Module) 2.没有perspectives,自动根据上下文调用相关工具 3.没有保存按钮,自动 ...
- Git 分支管理 不使用Fast forward模式进行合并 分支管理策略
通常,合并分支时,如果可能,Git会用Fast forward模式,但这种模式下,删除分支后,会丢掉分支信息. 如果要强制禁用Fast forward模式,Git就会在merge时生成一个新的comm ...
- Anagram(山东省2018年ACM浪潮杯省赛)
Problem Description Orz has two strings of the same length: A and B. Now she wants to transform A in ...
- 938. Range Sum of BST
Given the root node of a binary search tree, return the sum of values of all nodes with value betwee ...