ExtJS 6.2更新时绑定视图模型的问题

Question

我在绑定视图模型时在ExtJS 6.2中遇到问题。我想在提交表单时自动更新模型。这是我的视图模型：

 Ext.define('..model.OperationProperty', {    
    idProperty: 'ObjectID',    
    binding: {
        deep: true
    },    
    fields: [
        {
            name: 'ID',
            type: 'integer'
        },
        {
            name: 'Operation',
            type: 'auto'
        },
        {
            name: 'OperationForInvoice',
            type: 'auto'
        }
    ]
});

Operation和OperationForInvoice是不同的模型。

我成功加载了数据；

viewmodel.setData({
        operationproperty: operationproperty
          });

 operationproperty.load();

这是我在容器内的复选框。

{
xtype: 'container',
layout: {
    type: 'vbox',
    pack: 'center',
    align: 'middle'
},
items: {
   xtype: 'checkbox',
   bind: {
        data: {
           value: '{operationproperty.Operation.IsExplanationNecessary}',
           deep: true
        }
   }
         //bind: "{operationproperty.Operation.IsExplanationNecessary}",
         //deep: true,
         //bind: {
         //    value: "{showIsExplanationNecessary}"
         //}
         //bind: {
         //    Operation: {
         //        bindTo: '{operationproperty.Operation.IsExplanationNecessary}',
         //        deep: true
         //    }
         //}
}

和加载数据后的viewmodel looks good。加载了Operation和OperationForInvoice模型，并且我的复选框已选中。但是，当我在表单中进行某些操作时（例如，取消选中该复选框），更改不会出现在视图模型上，而是一个Operation对象出现在视图模型的底部，仅包含更改的项目。I added the screen shot

我也搜索“ deep：true”，但是它不起作用，或者我找不到正确的使用方式。而且我尝试在视图模型中使用公式，但显示相同的结果却给出相同的结果。

formulas: {

    showIsExplanationNecessary: {
        bind: {
            bindTo: '{operationproperty.Operation.IsExplanationNecessary}',
            deep: true
        },

        get: function (get) {
            return get;
        },

        set: function (value, type) {
            debugger;
            this.set('operationproperty.Operation.IsExplanationNecessary', value);  //not set the field and add Operation object again
        }
    }

}

我希望有人帮助谢谢。

Answer 1

我通过更改公式的设置部分来解决此问题。新公式将如下；

showIsExplanationNecessary: {

        get: function (get) {
            var operation = get('operationproperty.Operation');

            if (operation == null || operation.IsExplanationNecessary == null)
                return false;

            if (operation.IsExplanationNecessary != null) {
                return operation.IsExplanationNecessary;
            }

            return false;
        },

        set: function (value, type) {
            this.getData().operationproperty.getData().Operation.IsExplanationNecessary = value;
        }
    }

如果存在其他解决方案，请通知我。谢谢您的时间。