3

我正在使用 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();
}
4

1 回答 1

2

从 Angular CDK的门户 API开始：

this.errorMessagePortal.detach()

应该做的伎俩！

于 2019-01-25T10:38:18.650 回答