回调错误的范围

Question

我有一个问题，不记得如何解决它。我正在订阅来自第三方指令的回调，但没有在正确的范围内被回调。我的意思是，当它到达我的控制器时 this 实际上是我无法弄清楚的其他范围，因此它无法访问任何成员变量。我如何回到我的控制器范围？

<ui-gmap-layer type="HeatmapLayer" onCreated="$ctrl.heatLayerCallback"></ui-gmap-layer>

组件控制器：

heatLayerCallback(heatLayer: google.maps.visualization.HeatmapLayer) {
    this.heatMapLayer = heatLayer;
    // 'this' here is not my controller
}

如果我将呼叫改回

<ui-gmap-layer onCreated="$ctrl.heatLayerCallback(layer)"></ui-gmap-layer>

然后我的回调在正确的范围内执行（即我的控制器）但是参数 layer 丢失了；/

备注

我正在使用 Typescript、Angular 1.6 和 Angular 组件

Answer 1

您可以使用 bind 将回调绑定到您想要的上下文（您的控制器），或者简单地将它存储在回调之前的另一个新变量中，并在回调中通过该变量访问它。

类似于：

var heatLayerCallback = (function(heatLayer: google.maps.visualization.HeatmapLayer) {
    this.heatMapLayer = heatLayer;
    // 'this' here is now the same as the 'this' outside/below
}).bind(this); // bind to this or whatever context you want

...或者：

var that = this; // store this or whatever context you want
...
heatLayerCallback(heatLayer: google.maps.visualization.HeatmapLayer) {
    that.heatMapLayer = heatLayer;

确切的语法可能会有所不同，具体取决于您引用的代码所在的位置（例如，找到您想要的 "this" 所在的位置，或者使用任何上下文而不是 "this"）。

回调错误的范围

Callback on wrong scope

angularjs

typescript

angular-google-maps