Jak używać operatorów logicznych w formułach bind w ExtJS?

Question

Mam 3 pola wejściowe w formularzu i chcę, aby trzecie wejście było aktywne tylko wtedy, gdy pierwsze dwa wejścia mają wartości.

nie wydają się działać:

Ext.define('MyApp.view.myobj.MyPanel', { 
    extend:'Ext.Panel', 

    viewModel: {}, 

    items: [{ 
     xtype: 'form', 
     defaultType: 'textfield', 
     items: [ 
      {fieldLabel: 'Field 1', reference: 'field1', publishes: 'value'}, 
      {fieldLabel: 'Field 2', reference: 'field2', publishes: 'value'}, 
      { 
       fieldLabel: 'Field 3', 
       bind: { 
        disabled: '{!field1.value} || {!field2.value}' 
       } 
      },    
     ], 
    }], 
}); 

Fiddle

Answer 1

W modelu widoku, należy dodać formułę, aby powrócić do wartości {field1.value!} || {!} Field1.value

Jak na skrzypcach:

viewModel: { 
    formulas: { 
     something: { 
      bind: { 
       x: '{!field1.value}', 
       y: '{!field2.value}' 
      }, 

      get: function (data) { 
       if (data.x || data.y) return true; 
       else return false; 
      } 
     } 
    } 
}, 

items: [{ 
    xtype: 'form', 
    defaultType: 'textfield', 
    bodyPadding: 10, 
    items: [ 
     {fieldLabel: 'Field 1', reference: 'field1', publishes: 'value'}, 
     {fieldLabel: 'Field 2', reference: 'field2', publishes: 'value'}, 
     { 
      fieldLabel: 'Field 3', 
      bind: { 
       disabled: "{something}" 
      } 
     },    
    ], 

}] 

Answer 2

Dodaj konfigurację formuł do ViewModel tak:

formulas : { 
     showSomeComponent : function (get) { 
      return get('isAuthorized') && !get('isDisabled'); 
     } 
    } 

http://docs.sencha.com/extjs/5.1.0/Ext.app.ViewModel.html#cfg-formulas