Extjs-6 MVVM架构数据绑定来自Ext.app.Controller？

我在我的应用程序中使用MVVM architecture的Extjs-6。我有控制器如下（注意extend: 'Ext.app.Controller'）：Extjs-6 MVVM架构数据绑定来自Ext.app.Controller？

Ext.define('App.controller.gt.Point', { 
    extend: 'Ext.app.Controller', 
    myProp: { 
     x: 'x', 
     y: 'y' 
    }, 
    init: function() 
    { 
     ... 
    }, 
    activateDrawing: function() 
    { 
     ... 
     // I want to send myProp to 'App.view.gt.Point' view and 
     // it(myProp) use binding 
     var pointWin = Ext.create('App.view.gt.Point', {}); 
    } 
});

如果3210被调用时，控制器显示一个窗口（App.view.gt.Point视图）。这个窗口类为：

Ext.define('App.view.gt.Point', { 
    extend: 'Ext.window.Window', 
    ... 
    controller: 'gt-point', 
    viewModel: 'gt-point', 
    items: [{ 
     xtype: 'form', 
     items: [{ 
      xtype: 'numberfield', 
      fieldLabel: 'X', 

      /* 
      * I want to bind the numberfield with myProp.x 
      */ 
      bind: '{myProp.x}', 

     }, { 
      xtype: 'numberfield', 
      fieldLabel: 'Y', 

      /* 
      * I want to bind the numberfield with myProp.y 
      */ 
      bind: '{myProp.y}', 

     }] 
    }], 
    buttons: [{text: 'OK', action: 'OK', handler: 'onOk'}], 
    ... 
});

如果numberfields x和y改变，我想自动改变myProb.x和myProb.y。如何实现这个问题？

来源

2015-08-03 Morteza Malvandi

数据绑定和ViewController /控制器无关彼此，你可以有数据而无需控制器绑定，你只需要一个视图模型。

CONFIGS没有正确定义的绑定，它们就像XTemplate：

bind : '{myProp.y}'

假设你有myProp在你的视图模型是这样的：

data : { 
    myProp : { 
     x : 'foo', 
     y : 'bar' 
    } 
}

来源

2015-08-03 11:58:47

'myProp'是一个'App.controller.gt.Point'（它扩展了'Ext.app.Controller'）属性。我想发送这个属性来查看然后配置绑定。 –

数据绑定对类的属性不起作用，它们对ViewModel中的数据起作用。此外，开箱即可，ViewModel只能绑定到一个组件，而不是任何类。 –

但是，当类初始化时，我可以发送我的属性到组件（'App.view.gt.Point'）并添加'myProp'作为组件绑定数据？ –

必须numberfield的值绑定到myProp .x和myProp.y。 myProp也必须在viewModel中，而不是在控制器中。

Ext.define('App.view.gt.Point', { 
extend: 'Ext.window.Window', 
... 
controller: 'gt-point', 
viewModel: { 
    data:{ 
     myProp: { 
      x: 'x', 
      y: 'y' 
     } 
    } 
}, 
items: [{ 
    xtype: 'form', 
    items: [{ 
     xtype: 'numberfield', 
     fieldLabel: 'X', 

     /* 
     * I want to bind the numberfield with myProp.x 
     */ 
     bind: { 
      value:'{myProp.x}' 
     } 

    }, { 
     xtype: 'numberfield', 
     fieldLabel: 'Y', 

     /* 
     * I want to bind the numberfield with myProp.y 
     */ 
     bind: { 
      value:'{myProp.y}' 
     } 

    }] 
}], 
buttons: [{text: 'OK', action: 'OK', handler: 'onOk'}], 
... 
});

来源

2015-10-23 09:47:15 LightNight

Extjs-6 MVVM架构数据绑定来自Ext.app.Controller？

回答

相关问题