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. Scala学习——操作符(初)

    经常看到却反应不出来的(->) val a = 2 val b = a->4 //表示生成一个tuple println(b._1+" "b._2) //2 4

  2. exosip 和 pjsip 简介

     oSIP oSIP的开发开始于2000年7月,第一个版本在2001年5月发 布,到现在已经发展到3.x了.它采用ANSI C编写,而且结 构简单小巧,所以速度特别快,它并不提供高层的SIP会话 控制 ...

  3. 整理出来的一个windows关机、锁定、重启、注销 API调用

    using System.Runtime.InteropServices; namespace HookDemo { class WindowsExit { [StructLayout(LayoutK ...

  4. openstack开发环境搭建

    1       目的 让linux下的openstack代码能在windows上面实现同步开发. 2       目标 使用samba实现window与Linux的文件共享. 3       实验环境 ...

  5. java.lang.NoClassDefFoundError: javassist/util/proxy/MethodFilter

    转自:https://blog.csdn.net/rchm8519/article/details/23788053 1. ERROR - Context initialization failedo ...

  6. hadoop学习路线(转)

    刚刚入门hadoop,如何去学习hadoop.google一篇学习路线图,与童鞋们共勉: 转自:http://blog.csdn.net/zhoudaxia/article/details/88017 ...

  7. 同余方程 (codevs1200)

    题目描述××× 求关于 x 的同余方程 ax ≡ 1 (mod b)的最小正整数解. 输入输出格式××× 输入格式: 输入只有一行,包含两个正整数 a, b,用一个空格隔开. 输出格式: 输出只有一行 ...

  8. 深入Java集合学习系列:HashSet的实现原理

    1. HashSet概述: HashSet实现Set接口,由哈希表(实际上是一个HashMap实例)支持.它不保证set 的迭代顺序:特别是它不保证该顺序恒久不变.此类允许使用null元素. 2. H ...

  9. 如何使用Xshell连接VMware上的Linux虚拟机

    前序:最近开始研究Hadoop平台的搭建,故在本机上安装了VMware workstation pro,并创建了Linux虚拟机(centos系统),为了方便本机和虚拟机间的切换,准备使用Xshell ...

  10. according to tld or attribute directive in tag file attribute *** does not accept any expressions

    http://stackoverflow.com/questions/13428788/according-to-tld-or-attribute-directive-in-tag-file-attr ...