将 knockoutjs 绑定到 javascript 对象属性

Question

我是 Knockoutjs 的新手，所以请多多包涵。

我想用 knocoutjs 将 DxForm (DevExpress) 绑定到 javascript 对象属性，但我得到一个错误... "Cannot read property 'items' of undefined".

我不确定这是淘汰赛问题、DevExpress 问题还是我的编码技能不足。

这是我的代码...

HTML:

<div data-bind="dxForm: frm.options"></div>

Javascript:

var viewModel = function() {
    var that = this;

    // -----------------------------------------------------------------
    // Faste...
    // -----------------------------------------------------------------
    that.frm = {
       items: ko.observable(undefined),
       data: ko.observable(undefined),
       instance: ko.observable({}),
       options: {
          items: that.frm.items,
          formData: that.frm.data,
          onInitialized: function(e) {
             that.frm.instance(e.component);
          },
       },
    };

    return {
       frm: that.frm,
    };

 };

 var vm = new viewModel();
 ko.applyBindings(vm);

 var items = [{
    "dataField": "test",
    "editorOptions": {
       "type": "date",
       "pickerType": "calendar",
    },
    "editorType": "dxDateBox",
    "name": "Test",
    "visible": true
 }];

 var data = {
    test: 10,
 };

 vm.frm.data(data);
 vm.frm.items(items);

JSFiddle：https://jsfiddle.net/MojoDK/ke395v2c/3/

我想绑定到对象，因为我要使用多个 DxForm 对象，我喜欢将代码保存到一个对象中的每个 DxForm（更易于阅读）。

知道为什么会失败吗？

谢谢。

Answer 1

您的 frm.

中的闭包有问题

that 属性 in frm 对象不存在你应该使用 this...

但是在您的 onInitialized 函数中、this 和 that 不会针对您的 viewModel 对象...

所以这样，最简单的就是稍后声明选项对象：

 that.frm = {
       items: ko.observable(undefined),
       data: ko.observable(undefined),
       instance: ko.observable({})
    };

         that.frm.options = {
          items: that.frm.items,
          formData: that.frm.data,
          onInitialized: function(e) {
             that.frm.instance(e.component);
          },
       };

已更新jsfiddle

将 knockoutjs 绑定到 javascript 对象属性

Bind knockoutjs to javascript object property

javascript

knockout.js

devextreme

将 knockoutjs 绑定到 javascript 对象 属性

Bind knockoutjs to javascript object property

javascript

knockout.js

devextreme

将 knockoutjs 绑定到 javascript 对象属性