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的更多相关文章

  1. Kendo UI开发教程(16): Kendo MVVM 数据绑定(五) Events

    本篇和Kendo UI开发教程(14): Kendo MVVM 数据绑定(三) Click类似,为事件绑定的一般形式.Events绑定支持将ViewModel的方法绑定到DOM元素的事件处理(如鼠标事 ...

  2. Kendo MVVM 数据绑定(十一) Value

    Kendo MVVM 数据绑定(十一) Value Value 绑定可以把 ViewModel 的某个属性绑定到 DOM 元素或某个 UI 组件的 Value 属性.当用户修改 DOM 元素或 UI ...

  3. Kendo MVVM 数据绑定(十) Source

    Kendo MVVM 数据绑定(十) Source Source 绑定可以把 ViewModel 的值和由 Kendo 模板定义的目标元素绑定,如果 ViewModel 的值发生变化,被绑定的目标元素 ...

  4. Kendo MVVM 数据绑定(九) Text

    Kendo MVVM 数据绑定(九) Text Text 绑定可以使用 ViewModel 来设置 DOM 元素的文本属性,如果需要设置 input,textarea,或 select 的显示,需要使 ...

  5. Kendo MVVM 数据绑定(八) Style

    Kendo MVVM 数据绑定(八) Style Style 绑定可以通过 ViewModel 绑定到 DOM 元素 CSS 风格属性,例如: <span data-bind="sty ...

  6. Kendo MVVM 数据绑定(七) Invisible/Visible

    Kendo MVVM 数据绑定(七) Invisible/Visible Invisible/Visible 绑定可以根据 ViewModel 的某个属性来显示/隐藏 DOM 元素.例如: <d ...

  7. Kendo MVVM 数据绑定(五) Events

    Kendo MVVM 数据绑定(五) Events 本篇和 Kendo MVVM 数据绑定(三) Click 类似,为事件绑定的一般形式.Events 绑定支持将 ViewModel 的方法绑定到 D ...

  8. Kendo MVVM 数据绑定(四) Disabled/Enabled

    Kendo MVVM 数据绑定(四) Disabled/Enabled Disabled 和 Enabled 绑定可以根据 ViewModel 的某个属性值的 true,false 来设置 DOM 元 ...

  9. Kendo MVVM 数据绑定(三) Click

    Kendo MVVM 数据绑定(三) Click Click 绑定可以把由 ViewModel 定义的方法不绑定到目标 DOM 的 click 事件.当点击目标 DOM 元素时触发 ViewModel ...

随机推荐

  1. Java中的数组和方法

    3.1 数组的定义和使用 数组(Array)是用来存储一组相同数据类型数据的集合.数组中的每个数据称为一个元素(element),数组可以分为一维数组,二维数组和多维数组.我们 主要讲解一维数组和二维 ...

  2. DAL 层引用 System.Net.Http ,引发的一阵心慌

    快下班的时候 代码data 数据层编译失败,引起整个解决方案全部失败:其他同事虽然vs 版本不同,但是都能编译通过:考虑到今天更改过vs 的设置,把今天更改的设置全部都恢复,结果还是不行.最后直接恢复 ...

  3. TCP 连接的握手信息详解

    建立TCP需要三次握手才能建立,而断开连接则需要四次握手.整个过程如下图所示: 先来看看如何建立连接的. 首先Client端发送连接请求报文,Server段接受连接后回复ACK报文,并为这次连接分配资 ...

  4. 交互原型设计软件axure rp学习之路(三)

    (三)Axure rp元件的触发事件 l  OnClick(点击时): 鼠标点击事件,除了动态面板的所有的其他元件的点击时触发.比如点击按钮. l  OnMouseEnter(鼠标移入时): 鼠标进入 ...

  5. HDU - 4704 sum 大数取余+欧拉降幂

    Sum Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 131072/131072 K (Java/Others)Total Submi ...

  6. display:block inline-block inlined的区别

    一.首先要了解什么是块级元素与行级元素 块级元素 会占领页面的一行,其后多个block元素自动换行. 可以设置width,height,设置了width后同样也占领一行.同样也可以设置   margi ...

  7. [poj]开关类问题 枚举 位运算

    poj 1222  EXTENDED LIGHTS OUT 开关只有两种方案 按和不按,按两次相当于关 只用枚举第一排开关的按法即可,剩下的行为使上一排的灯全部关闭,按法可以确定,并且是唯一的. 最后 ...

  8. 散列表(Hash table)及其构造

    散列表(Hash table) 散列表,是根据关键码值(Key value)而直接进行访问的数据结构.它通过把关键码值映射到表中一个位置来访问记录,以加快查找的速度.这个映射函数叫做散列函数,存放记录 ...

  9. unity打包选项编辑器扩展

    using UnityEngine; using UnityEditor; using UnityEditor.Callbacks; using System.IO; public class Pos ...

  10. UIPI VS与Win7 共舞:用户界面特权隔离

    http://tech.it168.com/a2009/0924/737/000000737968.shtml [IT168 专稿]在上文中,我们介绍了操作系统服务的Session 0隔离,通过Ses ...