ExtJS Доступ к контроллеру по представлению

Question

Я хочу передать представление с контроллером в приложении Ext, но я не могу получить доступ к контроллеру, у меня есть кнопка на панели внутри панели дерева, но кнопка doesn «т выполнить действие в контроллере ...

у меня есть этот код:

вид:

Ext.require('Ext.slider.*'); 
Ext.define('app.view.ViewTablaContenido', { 
extend: 'Ext.window.Window', 
id: 'viewTablaContenido', 
shadow: false, 
alias: 'widget.tablaContenido', 

initComponent: function() { 

    var anchoPanatallaRes = window.screen.width; 
    var altoPantallaRes = window.screen.height; 

    var anchoTOC = 330; 
    var altoTOC = 473; 

    if (anchoPanatallaRes <= 1024) { 
     anchoTOC = 282; 
     altoTOC = 373; 
    } 
    var treeStore = Ext.getStore('capa'); 

    function addUrl(value, p, record) { 
     return value ? Ext.String.format(
       '<a href="'+value+'"target="_blank"'+'>Ver metadato'+'</a>' 
     ):''; 
    } 

    var tree = Ext.create('Ext.tree.Panel', { 
     title: '', 
     id: "arbolTabla", 
     width: anchoTOC, 
     height: altoTOC,    
     reserveScrollbar: true, 
     loadMask: true, 
     useArrows: true, 
     rootVisible: false, 
     store: 'capa', 
     allowDeselect : true, 
     border : true, 
     animate: true, 
     listeners: { 
      checkchange: function(node, checked, eOpts) { 
      }, 
      select: function(record, index, eOpts){ 
       console.log('Elemento seleccionado:', record, index, eOpts); 
      }, 
      beforedeselect: function(record, index, eOpts){ 
       console.log("Elemento deseleccionado :", record); 
      } 
     }, 
     columns: [{ 
      xtype: 'treecolumn', 
      text: 'Capa', 
      flex: 5, 
      sortable: true, 
      dataIndex: 'titulo' 
     },{ 
      text: 'Metadato', 
      flex: 2, 
      dataIndex: 'url', 
      renderer: addUrl 
     }], 

     tbar: [{ 
      labelWidth: 100, 
      xtype: 'triggerfield', 
      fieldLabel: 'Nombre capa:', 
      triggerCls: 'x-form-clear-trigger', 
      onTriggerClick: function() { 
       this.reset(); 
       treeStore.clearFilter(); 
       this.focus(); 
      }, 
      enableKeyEvents: true, 
      listeners: { 
       keyup: function() { 
        var field = tree.down('textfield'), 
        v; 

        try { 
         v = new RegExp(field.getValue(), 'i'); 
         treeStore.filter({ 
          filterFn: function(node) { 
           var children = node.childNodes, 
           len = children && children.length, 

           visible = node.isLeaf() ? v.test(node.get('nombre')) : false, i; 

           for (i = 0; i < len && !(visible = children[i].get('visible')); i++); 

           return visible; 
          }, 
          id: 'campoFiltroCapa' 
         }); 
        } catch (e) { 
         field.markInvalid('Expresión no valida'); 
        } 
       }, 
       buffer: 250 
      } 
     }, { 
      xtype : 'button', 
      text: 'Click', 
      id : 'btnApagarCapas', 
      action: 'apagarCapas', 
      tooltip : 'Apagar todas las capas', 
      padding:0 
     }] 
    }); 


    Ext.apply(this, { 
     title: 'TABLA CONTENIDO',   
     constrain: true, 
     header : { 
      titlePosition : 2, 
      titleAlign : 'center' 
     }, 
     closable : false, 
     width : anchoTOC, 
     height : altoTOC, 
     x : 20, 
     y : 270, 
     layout : 'fit', 
     animCollapse : true, 
     collapsible : true, 
     collapseDirection : Ext.Component.DIRECTION_LEFT, 
     listeners : { 
      collapse : function(p) { 
      }, 
      render: function(ev,eOpts){ 

      } 
     }, 
     items: [tree,], 
    }); 
    this.callParent(arguments); 
} 
}); 

контроллер:

Ext.define('app.controller.ControlTablaContenido', { 
extend: 'Ext.app.Controller', 
views : ['ViewTablaContenido'], 
init: function() { 
    this.control({ 
     'viewTablaContenido button[action=apagarCapas]': { 
      click: this.apagarCapas 
     }, 
     'viewTablaContenido':{ 
      render: this.renderizar 
     } 
    }); 

    console.log("antes de funcion"); 
}, 

apagarCapas : function(boton, e){ 
    alert("BUTTON PRESS!!"); 
}, 
renderizar: function(){ 
    alert("Rebder function"); 
} 
}); 

Answer 1

Похоже, ваш селектор ошибочен.

Вместо:

'viewTablaContenido button[action=apagarCapas]' 

Использование (xtype):

'tablaContenido button[action=apagarCapas]' 

Или (ID):

'#viewTablaContenido button[action=apagarCapas]'