Угловой, должен предоставить портал для прикрепления - PullRequest
Новая
       37

Угловой, должен предоставить портал для прикрепления

1 голос
/ 08 ноября 2019

Я пытаюсь открыть новое окно браузера через портал в угловой. Я следовал за этим стеком, так как не имел ни малейшего представления о том, как это сделать: https://stackblitz.com/edit/angular-open-window?

Откроется новое окно, но оно не показывает никакого содержимого, и я получаю сообщение об ошибке: 

Error: "Must provide a portal to attach"

Я импортировал портал в своем модуле приложения, так что это не проблема ...

Это мои файлы:

Window.ts 

import { Component, OnInit, ViewChild, ComponentFactoryResolver, ApplicationRef, Injector, OnDestroy } from '@angular/core';
import { CdkPortal, DomPortalHost } from '@angular/cdk/portal';

@Component({
  selector: 'app-preview-window',
  templateUrl: './preview-window.component.html',
  styleUrls: ['./preview-window.component.css']
})
export class PreviewWindowComponent implements OnInit, OnDestroy {

  @ViewChild(CdkPortal, {static: false}) portal: CdkPortal;
  private externalWindow = null;

  constructor(
    private componentFactoryResolver: ComponentFactoryResolver,
    private applicationRef: ApplicationRef,
    private injector: Injector
  ) { }

  ngOnInit() {
    this.externalWindow = window.open('', '', 'width=600, height=400, left=200, top=200');

    const host = new DomPortalHost (
      this.externalWindow.document.body,
      this.componentFactoryResolver,
      this.applicationRef,
      this.injector
    );

    host.attach(this.portal);
  }

  ngOnDestroy() {
    this.externalWindow.close();
  }
}

Window.html 

<ng-container *cdkPortal>
    <ng-content></ng-content>
</ng-container>

Родительский компонент html 

[...]
<app-preview-window *ngIf="showWindow == true">
    <h1>Test</h1>
</app-preview-window>
...