关闭弹出窗口，如果用户在Angular中注销

Question

在我的应用程序中，有一个页面用户可以打开弹出窗口。当用户单击注销时，必须关闭弹出窗口。我在 Global.ts类中使用静态变量用于存储弹出窗口

中的变量

public static QUICKTREND : any;

在打开弹出窗口的功能中，我存储了

this.quickWin = window.open(URL, 'QuickTrend', 'width=' + w + ', 
height=' + h + ', left=' + x + ', top=' + y + ', location=no'+ ', status=no'); 
 Constants.QUICKTREND = this.quickWin;

在lokout（）函数中，我获取弹出窗口和关闭

if(!isNullOrUndefined(Constants.QUICKTREND)){
       let currentIframe = Constants.QUICKTREND;
       currentIframe.close();
 }

如果我不刷新页面，它的工作正确。

但是，当我刷新页面时，可变的QuickTrend重置为未定义。

我搜索了解决方案以保持变量，如果页面刷新，仅保存到localstorage或sessionstorage的解决方案。但是这样，我无法保存弹出窗口对象，因为它是DOM对象，Converting circular structure to JSON错误显示。

localStorage.setItem("currentIframe", this.quickWin);

是否可以将弹出窗口保存到localstorage？

如果页面刷新时，我该如何关闭弹出窗口？

Answer 1

您可以尝试以下代码：

app.component.ts

import { Component, HostListener } from '@angular/core';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'Angular-Experiment';
  public myWindow;
  private URL = 'https://www.google.com/';
  @HostListener('window:beforeunload', ['$event'])
  closeOnrefresh(event) {
    console.log('closeOnrefresh', event);
    if (this.myWindow && !this.myWindow.closed) {
      this.myWindow.close();
    }
  }
  openWindow() {
    console.log("open window");
    if (!this.myWindow || (this.myWindow && this.myWindow.closed)) {
      this.myWindow = window.open(this.URL, 'self', 'width=1000,height=1000');
    } else {
      this.myWindow.focus();
    }
  }
  Winfocus() {
    console.log("Winfocus");
    if (this.myWindow && !this.myWindow.closed) {
      // this.myWindow.close();// to close
      this.myWindow.focus();// to focus
    }
  }
  Logout() {
    console.log("WinLogout");
    if (this.myWindow && !this.myWindow.closed) {
      this.myWindow.close();// to close
    }
  }
}

app.component.html

<input type="button" value="Open" (click)="openWindow()">
<input type="button" value="focus" (click)="Winfocus()">
<input type="button" value="Logout" (click)="Logout()">