从外部窗口调用角度组件方法

【问题标题】：call angular component method from external window从外部窗口调用角度组件方法
【发布时间】：2018-08-22 16:52:39
【问题描述】：

我正在使用 Angular 2 在我的 ASP .NET Web 应用程序中进行 Twitter 登录。我想将弹出窗口中的数据传递给组件。我使用了link中提到的方法。但是组件的回调不起作用。

下面是加载到外部登录窗口的代码

window.dispatchEvent(new Event('socialSuccess'));

在调用弹出窗口的组件中，我已经编写了回调

 @HostListener('window:socialSuccess', ['$event'])

  onSocialSuccess(event) {
    alert("here");
    this.PopUpCallback(event)

  }

onSocialSuccess 方法没有被调用。

请指导

谢谢

【问题讨论】：

【解决方案1】：

正如您在问题中提到的那样，您正在尝试的方法不起作用，您正在使用 twitter 登录 API，该 API 会打开一个弹出窗口进行登录。

原因是，有两个窗口，所以你有两个不同的 window 对象。

一个是主窗口（可能是您的应用程序窗口），另一个是弹出窗口。

解决方案：

假设您想将数据从弹出窗口传递到主窗口，所以在您的弹出窗口中，您应该使用您已经尝试过的上述方法，但请注意使用window.opener.disp...

唯一不同的是，window.opener 是启动弹出窗口的父窗口。

注意：window.opener 可能无法在 IE 中使用，因此您可以参考this post 获取 IE 浏览器。

希望对你有帮助:)

【讨论】：