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. BZOJ1798:[AHOI2009]维护序列

    浅谈树状数组与线段树:https://www.cnblogs.com/AKMer/p/9946944.html 题目传送门:https://www.lydsy.com/JudgeOnline/prob ...

  2. WPF Background的设置有坑

    今天帮忙同事解决在后台绑定时,动态更改控件(Grid)的Background. 有个陷阱,C#有2个命名空间有Brush和Color, 分别为System.Drawing和System.Window. ...

  3. TCP点对点穿透探索--失败

    TCP点对点穿透探索 点对点穿透是穿透什么 点对点穿透,需要实现的是对NAT的穿透.想实现NAT的穿透,当然要先了解NAT到底是什么,以及NAT是用来干什么的.NAT全称Network Address ...

  4. bootstrap模版兼容IE浏览器代码嵌入

    1.  bootstrap模板为使IE6.7.8版本(IE9以下版本)浏览器兼容html5新增的标签,引入下面代码文件即可. <script src="https://oss.maxc ...

  5. VMware设置桥接网络

     VMware设置桥接网络 2011-12-30 08:57:04 分类: LINUX 一.桥接网络的基本原理    配置成桥接网络连接模式的虚拟机就当作主机所在以太网的一部分, 虚拟系统和宿主机器的 ...

  6. 利用oracle session context 向oracle传值

    有时候,我们在执行数据库请求时,需要向数据库传一些应用程序的上下文信息,比如当前应用的用户.举个场景,我们要通过触发器记录对某些关键表的修改日志,日志包括修改的表,字段,字段的值,修改的时间,当然非常 ...

  7. SAP ECC6 IDES安装及虚拟机下载

    SAP ECC6.0 SR3 IDES Oracle.torrent(48.12G)下载 SAP ECC6 安装系列 SAP ECC6.0 IDES在Win7 X64上的安装 SAP ECC6.0 R ...

  8. CMD运行指令

    CMD运行指令   开始→运行→CMD→键入以下命令即可:   gpedit.msc-----组策略 sndrec32-------录音机   Nslookup-------IP地址侦测器 explo ...

  9. 如何运用多阶构建编写优雅的Dockerfile

    导读 Kubernetes要从容器化开始,而容器又需要从Dockerfile开始,本文将介绍如何写出一个优雅的Dockerfile文件. 文章主要内容包括: Docker容器 Dockerfile 使 ...

  10. docker-compose是个好东西,越用越香

     回顾前文 前文演示了在单一容器中部署 Nginx和ASP.NET Core WebApp, 正在前文评论区某大牛指出的,容器化部署 nginx+ASP.NET Core 有更符合实战的部署选择:多容 ...