zoukankan      html  css  js  c++  java
  • MVVM架构~knockoutjs系列之Mapping插件为对象添加ko属性

    返回目录

    对于一个JS对象来说,如果希望将所有属性进行监视,在之前我们需要一个个对属性添加ko.observable方法,而有了Mapping插件后,它可以帮助我们这件事.

    在Mapping出现之前

    var data={
            serverTime:ko.observable( '2010-01-07'),
            numUsers: ko.observable(3),
            realUsers: ko.observable(3),
    }

    我们需要对data对象里所有属性添加ko.observable方法,才可以对它进行监视.

    Mapping出现之后

    假设有这样一个场景,我们在对象里的realUsers需要跟随numUsers进行变化,这时,我们使用Mapping进行对象的KO处理,然后再使用ko.computed方法进行绑定,看一下代码

       var data = {
            serverTime: '2010-01-07',
            numUsers: 3,
            realUsers: 3,
        }
        var M = ko.mapping.fromJS(data);//data对象里所有属性添加ko属性
        M.realUsers = ko.computed(function () {
            return M.numUsers() ? M.numUsers() * 2 : 0;
        });
        ko.applyBindings(M, document.getElementById("model2"));

    对应的HTML代码如下

    <div id="model2">
        <input type="text" data-bind="value:serverTime" />
        <input type="text" data-bind="value:numUsers,valueUpdate: 'afterkeydown'" />
        <input type="text" data-bind="value:realUsers" />
    
    </div>

    通过这个例子,让我们知道如何快速的为JS对象添加KO属性,呵呵.

    返回目录

  • 相关阅读:
    关于Unity中的NavMeshAgent的remainingDistance问题
    关于Unity中MonoBehaviour的构造函数
    【Unity】Domina-Game总结与反思
    初步理解IOC和DI和AOP模式
    简单并查集归纳
    括号匹配-记错心得
    Django博客项目思路整理
    找零问题
    连续子序列最大和的O(NlogN)算法
    Python-demo(photo)
  • 原文地址:https://www.cnblogs.com/lori/p/3729377.html
Copyright © 2011-2022 走看看