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 ...
随机推荐
- 人工智能实践:linux 和 python 基础简介
linux下的目录 绝对路径:是以根目录(" / ")为起点的完整路径,以你所要到的目录为终点. 相对路径:是你当前的目录(" .")为起点的路径,以你所要到的 ...
- spring cloud之简单介绍
以下是来自官方的一篇简单介绍: spring Cloud provides tools for developers to quickly build some of the common patte ...
- Cocos2d-x v3.x and Xcode 6.x with ARM 64 Architecture
转自:http://becomingindiedev.blogspot.com.es/2014/12/cocos2d-x-v3x-and-xcode-6x-with-arm-64.html Hi! W ...
- 干货:SEO长尾关键词优化方法和技巧
在网站SEO优化上,优化比较成功的网站,根据SEO界前辈的经验结论,网站的总流量主要来源于长尾关键词,占网站总流量的80%.长尾关键词主要分布在网站的文章页,其次就是栏目页title.标签页.专题页等 ...
- C# 中的迭代器 yield关键字 提高性能和可读性
展示一个例子 IList<string> FindBobs(IEnumerable<string> names) { var bobs = new List<string ...
- HDU - 5451 Best Solver(循环节+矩阵快速幂)
Best Solver The so-called best problem solver can easily solve this problem, with his/her childhood ...
- Java负数的位运算
/** * 求负数的位运算 *///1. -10 >> 2 = ?//2. -10的原码: 1000 0000 0000 0000 0000 0000 0000 1010 最高位代表符号位 ...
- 程序员必备,C#各类项目、开源项目插件资料收藏
一.AOP框架 Encase 是C#编写开发的为.NET平台提供的AOP框架.Encase独特的提供了把方面(aspects)部署到运行时代码,而其它AOP框架依赖配置文件的方式.这种部署方面 ...
- 过滤asp.net页面每次发出请求之前访问
public class PageFiltert : System.Web.UI.Page { public PageFiltert() { // //TODO: 在此处添加构造函数逻辑 // } p ...
- SQL 截取字段空格之前的数据
MYSQL group by left(city,LOCATE(' ',city)) SQL select a,left(a,charindex( ' ',a)) FROM test SELECT g ...