在一些Knockout例子中，直接在htm中添加scripts写viewmodel，如何能将让ViewModel从htm中剥离出去呢？从knockout官网上找到了解决方法，如下：

1.knockout.htm

<html>

<head>

    <script type="text/javascript" data-main="init.js" src="require.js"></script>

</head>

<body>

    <p>First name:

        <input data-bind="value: firstName" /></p>

    <p>First name capitalized: <strong data-bind="text: firstNameCaps"></strong></p>

</body>

</html>

2.init.js

require(['knockout-2.1.0', 'appViewModel'], function (ko, appViewModel)

{

    ko.applyBindings(new appViewModel());

});

3.appViewModel.js

define(['knockout-2.1.0'], function (ko) {

    return function appViewModel() {

        this.firstName = ko.observable('Bert');

        this.firstNameCaps = ko.computed(function ()

        {

            return this.firstName().toUpperCase();

        }, this);

    };

});

这样就不必在htm中写一大堆js代码了。

Knockout: 让ViewModel从htm中剥离出去。的更多相关文章

  1. 从WW中剥离一个三维场景框架

    从WW中剥离一个三维场景框架,初步实现的一个.可以绘制一个三角形,但是不能够控制摄像机,没有增加鼠标事件.没有投影,世界变幻之类的东西.以后会不断学习逐步增加进来. 下载地址 下载V1.0.0.2

  2. htm中的 src未指定具体路径的话 默认查找当前文件夹

    htm中的 src未指定具体路径的话 默认查找当前文件夹

  3. 用好JAVA中的函数式接口，轻松从通用代码框架中剥离掉业务定制逻辑

    大家好,又见面了. 今天我们一起聊一聊JAVA中的函数式接口.那我们首先要知道啥是函数式接口.它和JAVA中普通的接口有啥区别?其实函数式接口也是一个Interface类,是一种比较特殊的接口类,这个 ...

  4. MVVM架构~knockoutjs系列之从Knockout.Validation.js源码中学习它的用法

    返回目录 说在前 有时,我们在使用一个插件时,在网上即找不到它的相关API,这时,我们会很抓狂的,与其抓狂,还不如踏下心来,分析一下它的源码,事实上,对于JS这种开发语言来说,它开发的插件的使用方法都 ...

  5. ViewModel在MVC3中的应用：一个view显示多个model

    在mvc3中,默认是一张数据表对应一个model,一个视图 view只显示一个model. 但是有些时候,我们一个视图上可能需要显示多个model的内容,即一个网页可能要展示多张表的信息,那怎么办呢, ...

  6. ViewModel在MVC3中的应用：实现多字段表格的部分更新

    假设我们有这样一张用户表: public class F_users { [Key] [Display(Name="用户名:")] [Required(ErrorMessage=& ...

  7. 将Error异常日志从普通日志中剥离

    开发过程中经常需要调试和线上环境查看异常日志的需求,但普通消息与异常消息混在一起实在是非常难得找,上则NM的文档够你头痛,所以就将Error级别的日志抽离出来. 本示例采用log4net来配置: 1. ...

  8. 在HTM中显示播放视频

    注意:video中source 源文件地址src替换成你的video路径<html>    <button onclick="playPause();">播 ...

  9. htm 中 <b>和<strong>的区别

    显示上两者没有任何区别,都是粗体<b>:为了加粗而加粗,推荐使用 css font-weight 属性来创建粗体文字.<strong>:为了强调而加粗,表示十分重要.在网页中使 ...

随机推荐

  1. oracle 如何查看oracle数据库版本

      select * from v$version 写在最后 哪位大佬如若发现文章存在纰漏之处或需要补充更多内容,欢迎留言!!! 相关推荐: 个人主页 oracle专题  

  2. 下拉列表框select

      下拉列表框select CreateTime--2017年5月15日15:39:24 Author:Marydon 三.下拉列表框 (一)语法 <select></select& ...

  3. iOS中TableView小技巧

    摘要: TableView是ios开发中经经常使用到的控件,这里统一记录一下开发中遇到的经常使用小技巧,不断探索更新.也希望大家能够告诉我很多其它经常使用的小技巧啦~一起进步 1.去除多余的列表线条 ...

  4. Knockout学习之文本和外观绑定器

    文本和外观绑定器 “visible”绑定 该绑定主要用来让我们通过监控属性可以控制html文档的显示,只要绑定的监控属性为false.0.null或者undefined则隐藏该标签,否则显示.比如下面 ...

  5. 要想找出以“y”结尾的名字

    要想找出以“y”结尾的名字:mysql> SELECT * FROM pet WHERE name LIKE '%y'“_”:匹配任何单个字符“%”:匹配任意数目字符(包括零字符)

  6. TL认证和运作经典案例评选

    评选背景: 1.TL能力模型推出一年多时间以来,各地区.部门的TL认证和运作如火如荼,中开社上已有部分案例输出: 2.有部门在认证和运作上希望能借鉴优秀案例的经验,并且更希望能得到本地其他部门的帮扶: ...

  7. boost asio异步读写网络聊天程序client 实例具体解释

    boost官方文档中聊天程序实例解说 数据包格式chat_message.hpp <pre name="code" class="cpp">< ...

  8. Struts1与Struts2的那些事

    一.概述 Struts1以ActionServlet作为核心控制器,由ActionServlet负责拦截用户的全部请求.Struts1框架有3个重要组成部分:Action.ActionForm和Act ...

  9. ubuntu 16.04 LTS 修改 国内源（以中科大源为例）

    国内有很多ubuntu的源,包括:网易源(这个之前用过,速度很快的),阿里源,还有很多教育网的源,如:清华源,中科大源. 这里要下载的是中科大ubuntu16.04的源列表,可以在这里获得:https ...

  10. 如何在 CentOS 7 中安装或升级最新的内核

    虽然有些人使用 Linux 来表示整个操作系统,但要注意的是,严格地来说,Linux 只是个内核.另一方面,发行版是一个完整功能的系统,它建立在内核之上,具有各种各样的应用程序工具和库. 在正常操作期 ...