Calling view methods from custom HTML

[robl]

I have a view that is a container with custom HTML. In my custom HTML, I want to be able to call the methods in the view. How can I do that?

The code should look something like this.

Ext.define('MyApp.view.MyPanel', {
    extend: 'Ext.Panel',
config: {
  html: '<div><a href="???????">Call view method 1</a><a href="???????">Call view method 2</a></div>'
},
 method1: function() {
  console.log('Called method 1!!!');
},
method2: function() {
  console.log('Called method 2!!!');
}
});

[metabren]

This should work.

  Ext.define('MyApp.view.MyPanel', {
    extend: 'Ext.Panel',
    config: {
      html: '<div><a id="method-1-caller" href="#">Call view method 1</a><a id="method-2-caller" href="#">Call view method 2</a></div>'
    },


    initialize: function() {
      this.getEl().on({
        scope: this,
        tap: this.method1,
        delegate: '#method-1-caller'
      });
      this.getEl().on({
        scope: this,
        tap: this.method2,
        delegate: '#method-2-caller'
      });
      return this.callParent();
    },


    method1: function() {
      console.log('Called method 1!!!');
    },


    method2: function() {
      console.log('Called method 2!!!');
    }
  });