【问题标题】:Knockout.Mapping and EcmaScript 5 get setKnockout.Mapping 和 EcmaScript 5 得到设置
【发布时间】:2012-12-12 17:45:12
【问题描述】:

ko.mapping 可以在单个 ko.computed 中转换 get, set property's (ES5) 吗?

var people = { 
    get Name (){ 
        return this._name;
    },
    set Name(value){
        this._name = value;
    } 
};
var vm = ko.mapping(people, {/* mapping getset to computed */});
vm.Name instanceOf ko.computed === true.

ko.mapping 支持这个或如何做到这一点?

【问题讨论】:

    标签: javascript knockout.js knockout-mapping-plugin ecmascript-5


    【解决方案1】:

    我确定您的意思是使用可观察对象,而不是计算对象,因为这不依赖于其他可观察对象。

    我创建了a gist, including tests, 创建具有可观察属性的模型,以及一些实用函数来创建它们。核心代码在这里:

    var defineProperty = function(type, obj, prop, def) {
      if (obj == null || typeof obj != 'object' || typeof prop != 'string') {
        throw new Error('invalid arguments passed');
      }
    
      if (Object.prototype.toString.call(def) === '[object Array]' && type === 'observable') {
        type = 'observableArray';
      }
    
      var obv = ko[type](def);
      Object.defineProperty(obj, prop, {
        set: function(value) { obv(value) },
        get: function() { return obv() },
        enumerable: true,
        configurable: true
      });
    
      Object.defineProperty(obj, '_' + prop, {
        get: function() { return obv },
        enumerable: false
      });
    };
    
    ko.utils.defineObservableProperty = defineProperty.bind(null, 'observable');
    ko.utils.defineComputedProperty = defineProperty.bind(null, 'computed');
    
    ko.observableModel = function(defaults) {
      for (var prop in defaults) {
        if (defaults.hasOwnProperty(prop)) {
          if (defaults[prop] != null && typeof defaults[prop] == 'object' && Object.prototype.toString.call(defaults[prop]) !== '[object Array]') {
            // should this also be an observable property?
            this[prop] = new ko.observableModel(defaults[prop]);
          } else if (!defaults[prop] || !ko.isSubscribable(defaults[prop])) {
            ko.utils.defineObservableProperty(this, prop, defaults[prop]);
          } else {
            this[prop] = defaults[prop];
          }
        }
      }
    };
    

    【讨论】:

    • 非常好的例子!跟我想的不太一样,但是帮了大忙。我的目标是真正连接以获取/设置视图,我在 github 上做了一个项目以继续或增量 ko.mapping:project 谢谢。
    • FYI... 因为 observable 是一个函数,所以你不需要在它周围设置一个包装器......你可以直接链接到它(即获取:obs,设置:obs) ,这意味着您可以在不需要括号的情况下设置/读取您的可观察值...
    猜你喜欢
    • 2011-06-06
    • 2013-09-26
    • 2013-10-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-02-02
    • 2011-01-17
    • 1970-01-01
    相关资源
    最近更新 更多