angular - 将 Reactive Forms 组传递到路由器导出

Question

我正在尝试在多个组件之间共享我的响应式表单，但在尝试通过路由来实现时遇到了问题。我收到的错误:'无法绑定(bind)到 'group'，因为它不是 'router-outlet' 的已知属性

这是路由器:

<router-outlet [group]="turnoverService.turnoverForm"></router-outlet>

有没有办法通过路由将响应式表单传递给子组件？

Answer 1

在 Angular ( [] ) 中使用绑定(bind)语法仅在组件具有 @Input 时才有效与绑定(bind)同名的属性。 router-outlets没有这个另外，路由组件作为兄弟添加到 <router-outlet> ，不是 child 。

最简单的方法(也是 IMO 的最佳实践)是仅使用共享服务，该服务具有随后被注入(inject)子组件的数据。看起来你有一个 turnoverService ，因此子组件需要在其构造函数中获取它。

更多信息:Passing data into "router-outlet" child components (angular 2)

编辑:另一种方法是使用 resolve路由定义本身的方法。 resolve函数将在路由被激活时触发，但路由本身直到 resolve 才会真正加载。函数成功完成。然后路由组件将可以访问 resolve数据来自 Injector .如果您已经拥有数据或需要执行一些逻辑来获取它，这将起作用，但如果 resolve 可能不是最佳解决方案。方法正在进行异步 AJAX 调用。

有关 resolve 的更多信息在这个优秀article (这里缺少 Angular 文档本身)。