1

我的视图中有一个条形图，其中有一个正在检索条形列项目的侦听器，现在我必须从控制器调用该侦听器这是我的代码...

这是我认为的听众..

listeners: {
    itemmousedown: function (obj) {
        alert(obj.storeItem.data['source'] + ' &' + obj.storeItem.data['count']);
    }
},

我必须从我的控制器调用这个监听器。这是我的代码..

init: function () {
    this.control({
        'barColumnChart': { //this is the id of the bar chart in my View
            click: function () {

            }
        }
    });
},
4

4 回答 4

0

您不会“调用”侦听器，而是在触发事件时调用侦听器。因此，您应该在控制器内设置 itemmousedown 侦听器，并将其从视图中移除。我不知道哪个视图有 itemmousedown 事件，但如果确实是条形图，它应该是这样的：

this.control({
    '#barColumnChart': { //this is the id of the bar chart in my View
        itemmousedown: function(obj) {
            alert(obj.storeItem.data['source'] + ' &' + obj.storeItem.data['count']);
        }
    }
});

但是，如果事件属于另一个视图，则应将“#barColumnChart”替换为正确视图的 id（或该视图的另一个选择器）

于 2013-05-05T18:02:30.933 回答
0

您是否尝试过使用“#barColumnChart”作为选择器？我有点生疏，但我认为这就是您在控制器中通过其 id 获取元素的方式。

于 2013-05-05T17:44:32.410 回答
0

如果将侦听器创建到控制器中，则不必将其创建到视图中。
在控制器中，您可以像这样创建对视图的引用： 

refs: [{
    ref     : 'barColumnChart',
    selector: 'your_view'
}
   }]

然后创建将在项目鼠标按下时调用的函数： 

me.control({
'barColumnChart#your_chart': {
            click: me.your_function
        }
}),

your_function(button, e, options) {
        alert(obj.storeItem.data['source'] + ' &' + obj.storeItem.data['count']);
    }
于 2013-05-05T19:55:01.230 回答
0

itemmousedown 事件由“series”触发，series 不是组件，仅在布局后由图表初始化。因此，为了获得对系列对象的引用，我们需要等待图表的后布局事件。但不幸的是，图表没有触发 afterlayout 事件......所以，首先覆盖图表的 afterComponentLayout 方法，使其触发事件：

Ext.define('MyNewChart',{
    extend: 'Ext.chart.Chart',
    afterComponentLayout: function(width, height, oldWidth, oldHeight) {
        this.callParent(arguments);
        this.fireEvent('afterlayout', this);
    }
});

现在，使用我们的新图表类来创建您的图表：

Ext.create('MyNewChart', {
     id: 'myChart',
     ...
});

现在我们可以创建一个控制器，在 itemmousedown 事件上实际创建一个监听器：

Ext.define('Gamma.controller.ControlFile', {
    extend : 'Ext.app.Controller',
    initializedEvents: false,
    init: function() {
        this.control({
            '#myChart': {
                afterlayout: this.afterChartLayout
            }
        });
    },
    afterChartLayout: function(){
        if(this.initializedEvents==true) return;
        this.initializedEvents=true;
        Ext.getCmp('myChart').series.items[0].on('itemmousedown',function(obj){
            console.log(obj);
        });
    }
});

这是一个工作小提琴：http: //jsfiddle.net/qjfBC/

于 2013-05-06T12:14:53.987 回答