angular2 在不确定父组件的情况下，子组件怎么调用父组件的方法

问题描述

问 题

在不确定父组件的情况下，子组件怎么调用父组件的方法

需求

1. pageB 是 pageA1，pageA2 的子路由所对应的组件，内容是一个表单

2. pageA1，pageA2 是一个包含弹框dialog，dialog里面是route-outlet。点击页面的按钮，弹框弹出，弹框里面的内容是pageB

3. 假设 pageB表单提交， 我需要关闭dialog，并且pageA1，pageA2 里面的表格数据要刷新

尝试处理的方式

一开始解决这种问题，是在pageB通过@Inject(forwardRef(() => pageA1)) private _parent: pageA1 获取父组件实例，然后调用里面的方法关闭窗口，并且重新请求表格数据。

这样处理会有一个问题，就是pageB必须要确定其父组件的类型，是pageA1还是pageA2

问题

1. 有没有什么方法能解决这个问题？引入redux这种的ngrx可以解决这个问题吗。

2. 或者说有没有什么更好的方式实现弹框提交表单

解决方案

谢邀，这个涉及组件通信的内容，可以在父组件监听子组件的消息，具体可以先参考一下以下两篇文章：

• Angular 2 RxJS Subject 应用

• Angular 2 Components Communicate

线上的具体示例

这篇关于angular2 在不确定父组件的情况下，子组件怎么调用父组件的方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！