从添加事件侦听器几次

避免我有一个Office加载项可以通过从添加事件侦听器几次

popup = window.open("https://localhost:3000/#/new", "popup", "status=1, location=1, width=1000, height=1200")

此页由角编码打开一个弹出浏览器窗口。为了启用加载项和弹出窗口之间的通信，我在控制器中添加了一个监听器。因此，他们可以通过postMessage发送消息给对方。

app.controller("Ctrl", ["$scope", "$window", function($scope, $window) { 
    ... ... 
    $window.addEventListener("message", receiveMessage, false); 
}

的通信作品中，当外接改变弹出到newUrl的网址（其中newUrl是使用相同的控制器的另一页实例），通过

popup.location.href = newUrl

目视除外，弹出窗口已更改，但是先前的侦听器未被删除。因此，加载项发送的一条消息会被接收并处理两次（即通过新页面和前一页面）。

有没有人知道如何正确清理侦听器，当加载项更改弹出页面？

来源

2017-04-05 SoftTimur

Cenk的评论是正确的：事件删除和事件添加逻辑必须在完全相同的功能范围内。

因此，在外接的一侧，当弹出窗口切换到另一个网址，我需要通过postMessage手动发送close消息页面：

popup.postMessage({ "req": "close" }, popup.location.href); 
popup.location.href = url

在弹出的侧面页面，我可以在receiveMessage删除监听器，因为它仍然是在同一页/功能范围：

app.controller("Ctrl", ["$scope", "$window", function($scope, $window) { 
    ... ... 
    var receiveMessage = function (event) { 
     ... ... 
     switch (event.data) { 
      ... ... 
      case "close": 
       $window.removeEventListener("message", receiveMessage, false) 
     } 
    } 
}])

来源

2017-04-10 19:42:45 SoftTimur

this.receiveMessage = function(e){ 
    ... 
} 
$window.addEventListener("message", this.receiveMessage, {once: true, capture: false});

来源

2017-04-05 15:20:48

我不知道为什么，我的测试表明听者仍然存在; 'removeEventListener'并不真的删除监听器... – SoftTimur

你能试试吗？ $ window.addEventListener（“message”，receiveMessage，{once：true，capture：false}）; –

如果您的receiveMessage位于控制器中，那么每个控制器调用的每个receiveMessage回调都不同于其他控制器调用，因此它永远不会被删除。您的事件删除和事件添加逻辑必须在相同的功能范围内。 –

从添加事件侦听器几次

回答

相关问题