首页 > 解决方案 > 角度 6 组件功能不适用于 iframe 的 HostListener

问题描述

我在 iframe 中有一个 Angular 6 应用程序和一个不同的 Web 应用程序。当我使用 postmessage 函数从 iframe 接收消息时,我确实进入了 onMessage 函数,然后我确实进入了 openOffNet - 但随后弹出窗口不起作用。当我从按钮激活弹出窗口时它不起作用。有人知道为什么它不起作用吗?

谢谢你

 import {HostListener, Component, OnInit } from '@angular/core';
    import {NgbModal, NgbActiveModal} from '@ng-bootstrap/ng-bootstrap';
    import {NgbdModalContentComponent} from '../ngbd-modal-content/ngbd-modal-content.component';
    import {ModalAddDeviceComponent} from '../popupBoxes/modal-add-device/modal-add-device.component';
    import {ModalAddOffnetComponent} from '../popupBoxes/modal-add-offnet/modal-add-offnet.component';

    @Component({
      selector: 'app-top-bar',
      templateUrl: './top-bar.component.html',
      styleUrls: ['./top-bar.component.css']
    })
    export class TopBarComponent implements OnInit {

      constructor(private modalService: NgbModal) { 
        (<any>window).onMessage= this.onMessage.bind(this);
      }

      ngOnInit() {
      }

       @HostListener('window:message', ['$event'])
      onMessage(e) {
        console.log('HostListener');
        if(e.data.function == 'subnetworkClicked'){

        }
        else{
          console.log("open popUp");
          this.openOffNet();
        }



      }




      openOffNet () : void {
        const modalRef = this.modalService.open(ModalAddOffnetComponent);

      }
    }

标签: iframewindowmessageangular6

解决方案


尝试 'document:message' 而不是 'window:message'


推荐阅读