Angular CDK门户从门户中分离

Question

我正在使用Angular CDK的门户创建一个错误消息组件，该组件需要在主体中呈现(因此使用门户(，而不是其他组件。

它工作得很好，尽管在错误消息本身上，我需要能够从组件中关闭它。

我正在使用一项服务来设置门户并打开/隐藏消息。问题是，我不能从错误消息组件本身调用close方法，因为这样我就有了一个循环依赖关系，它就全部崩溃了。

我知道有了CDK的覆盖，你可以从它的组件中引用它，有没有任何方法可以对门户做同样的事情，这样我就可以从错误消息组件中分离门户？

谢谢。

这是服务代码

private errorMessagePortal: ComponentPortal<ErrorMessageComponent>;
private bodyPortalHost: DomPortalHost;
constructor(
private componentFactoryResolver: ComponentFactoryResolver,
private appRef: ApplicationRef,
private injector: Injector
) {
this.errorMessagePortal = new ComponentPortal(ErrorMessageComponent);
this.bodyPortalHost = new DomPortalHost(document.body, this.componentFactoryResolver, this.appRef, this.injector);
}
// show error message
showErrorMessage(errorMessage: ErrorMessage) {this.bodyPortalHost.attachComponentPortal(this.errorMessagePortal).instance.errorMessage = errorMessage;
}
closeErrorMessage() {
this.bodyPortalHost.detach();
}

Answer 1

从Angular CDK:到门户API

this.errorMessagePortal.detach()

应该做的把戏！