Question

我有一个构建Google图表的指令。当指令从图表中收到一个事件时，我想在我的控制器范围内触发一个事件处理程序。

示例：http://plnkr.co/edit/yn4KuQfrYvlQNbPSWk3Q?p=preview

在我的标记中：

<div column-chart="chartData" row-selected="rowSelected(index)"></div>

在我的指令中：

google.visualization.events.addListener(chart, 'select', function () {
    console.log('directive#select', chart.getSelection());
    // call the function defined in the markup for "row-selected"
});

在我的控制器中：

$scope.rowSelected = function (index) {
    console.log('controller#rowSelected', index);
    // the function I want to ultimately be called
};

我可以使用1指令吗？图表指令能否知道行选择指令？任何帮助你都很棒，谢谢。

Answer 1

如果您想要更改范围的角度范围之外的代码，则需要使用$apply来指示角度。这将在更新范围

的情况下运行摘要周期

因此，使用图表中的事件监听器可以：

 google.visualization.events.addListener(chart, 'select', function () {
    scope.$apply(function(){
        scope.rowSelected=chart.getSelection()
     })

 });

的 DEMO

Answer 2

您可以访问范围函数rowSelected

google.visualization.events.addListener(chart, 'select', function () {
  console.log('directive#select', chart.getSelection());
  scope.rowSelected(chart.getSelection().row)
});

如果您不想对 rowSelected 进行硬编码，可以通过属性传递它，使其更加灵活。

如何向Angular指令添加侦听器？

2 个答案: