在一些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. 003-Go初探Iris

    1.参考资源:https://iris-go.com/v10/start#Getting-Started 2.首先下载:go get -u github.com/kataras/iris,此处时间较长 ...

  2. JAVA eclipse 安装lombok

    1.下载lombok http://projectlombok.org/download.html 2.点击安装: 如果eclipse没有安装到默认目录,那么需要点击Specify选择eclipse的 ...

  3. npm 主要命令

    本文主要参考自:http://www.runoob.com/nodejs/nodejs-npm.html 1.使用 npm 命令安装模块 $ npm install express var expre ...

  4. Flash Actionscript 多线程Worker 压缩图片

    package { import flash.display.Bitmap; import flash.display.Sprite; import flash.events.Event; impor ...

  5. 获取公钥证书的DN（Distinguished Name）

    DN --  Distinguished Name,证书持有人的唯一标识符. 可以通过下面的openssl命令来打印出证书的DN. openssl x509 -subject -nameopt RFC ...

  6. Spring Boot 启动载入数据 CommandLineRunner

    实际应用中,我们会有在项目服务启动的时候就去载入一些数据或做一些事情这种需求. 为了解决这种问题.Spring Boot 为我们提供了一个方法.通过实现接口 CommandLineRunner 来实现 ...

  7. 分布式交易系统的并发处理, 以及用Redis和Zookeeper实现分布式锁

    交易系统 交易系统的数据结构 支付系统API通常需要一个“订单号”作为入参, 而实际调用API接口时使用到的往往不是真正意义的业务订单号, 而是交易订单号.  支付系统的API会使用“商户号+订单号” ...

  8. ArcGIS Desktop 10.1+ArcEngine10.1完全破解安装教程（含下载地址+亲测可用！）

    最近在二次开发中用到了VS2010+ArcGIS的二次开发模式,因为之前的某些原因,对ArcGIS的接触甚少.初次安装也遇到了很多问题,这里做一个总结. 系统环境 win732位操作系统 需要文件 ( ...

  9. 使用Docker运行Java Web应用

    前言 Tomcat是目前比较流行的Web应用服务器,深受Java爱好者的喜爱.通常J2EE应用的产出物是一个war包,这篇文章将为你介绍如何使用Docker运行Tomcat+war包的Java Web ...

  10. chrome配置文件校验初始化隐含參数的逆向

     这篇文章接上一篇文章进一步升华:花了4个小时获得该信息的计算方式 比方在 chrome文件夹下的\Chrome\User Data\Default文件夹下的Secure Preferences,须要 ...