大佬教程收集整理的这篇文章主要介绍了如何订阅通过@ angular / cdk / portal注入的Observable of Component?,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
@H_766_5@modalservice创建ModalComponent的一个实例,并使用@ angular / cdk / portal将其注入页面.
我可以得到模态显示就好了:-)
@H_766_5@modalComponent有一个Observable属性,我希望Modalservice能够订阅,这样当在模态中单击“关闭”按钮时,可以发出一个值,Modalservice可以关闭模态.但是,当组件发出值时,服务不会对其执行操作.在服务方面,它看起来像我订阅,但从组件方面,它显示0观察员.
我想也许我可以使用一个典型的@Output()EventEmitter,但我不确定是否因为在modal类中挂起它,因为child元素最初不存在.
我想也许我的组件引用不太正确(也许我有两个不同的?).我正在尝试this answer的建议
我有什么想法我做错了吗?
服务
export class Modalservice { private modalPortal: ComponentPortal<any>; private bodyPortalHost: DomPortalHost; constructor(private componentFactoryResolver: ComponentFactoryResolver,private appRef: ApplicationRef,private injector: Injector) { } showModal(modalName: String) { // set up the portal and portal host this.modalPortal = new ComponentPortal(ModalComponent); this.bodyPortalHost = new DomPortalHost( document.body,this.componentFactoryResolver,this.appRef,this.injector); // display the component in the page let componentRef = this.bodyPortalHost.attach(this.modalPortal); // listen for modal's close event componentRef.instance.onModalClose().subscribe(() => { console.log('I will be very happy if this this gets called,but it never ever does'); this.closeModal(); }); // console.log(componentRef.instance.onModalClose()) shows 1 subscriber. } closeModal() { this.bodyPortalHost.detach(); } }
零件
export class ModalComponent { private modalClose: Subject<any> = new Subject(); onModalClose(): Observable<any> { return this.modalClose.asObservable(); } closeModal() { // console.log(this.onModalClose()) **shows zero observers** :-( this.modalClose.next(); this.modalClose.complete(); } }
以上是大佬教程为你收集整理的如何订阅通过@ angular / cdk / portal注入的Observable of Component?全部内容,希望文章能够帮你解决如何订阅通过@ angular / cdk / portal注入的Observable of Component?所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。