代码之家  ›  专栏  ›  技术社区  ›  Hien Nguyen

如果用户以角度注销,则关闭弹出窗口

  •  0
  • Hien Nguyen  · 技术社区  · 5 年前

    在我的应用程序中,有一个页面用户可以打开一个弹出窗口。当用户单击注销时,它必须关闭弹出窗口。 我使用静态变量将弹出窗口变量存储在 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;
    

    在logout()函数中,我得到弹出窗口并关闭

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

    如果我不刷新页面,它就可以正常工作。

    但当我刷新页面时,变量quicktrend重置为未定义。

    我搜索了在页面刷新时保留变量的解决方案,这是保存到localstorage或sessionstorage的唯一解决方案。但是这样,我就不能保存弹出窗口对象,因为它是dom对象, Converting circular structure to JSON 错误显示。

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

    是否可以将弹出窗口保存到本地存储?

    如果页面刷新,如何在注销时关闭弹出窗口?

    0 回复  |  直到 5 年前
        1
  •  2
  •   Eeshwar Ankathi    5 年前

    您可以尝试以下代码:

    应用组件

    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()">