我正在构建具有很多功能的复杂 View 。为了使事情井井有条，我将其分解为几个自定义组件。
我会尽量保持简短，因为我确实有它的工作，但我无法想象这是“正确的方式”。
结构:
- AppComponent(has binding to dataModel)
--LayoutComponent
---HeaderComponent
---SideMenuComponent
---MainContentComponent
我需要能够让每个组件访问数据模型的同一单个实例。但是，当我将服务作为提供者添加到每个组件中的构造函数时，它会生成一个新的数据实例。因此，在一个组件中完成的编辑不会反射(reflect)在另一组件的数据中。
所以我所做的就是给最上面的父项 AppComponent组件访问 dataModel，然后通过模板将其沿链传递 [(dataModel)]="dataModel" .
然后在每个组件中我添加了 dataModel变量一开始为 null，但在构建模板后，我将其绑定(bind)到该局部变量。
这是有效的，因为我可以将每个组件中的输入绑定(bind)到同一字段，即 dataModel.name，并且当我更新它时，所有组件都会反射(reflect)更改。
这似乎不是一个干净的方法。任何帮助将不胜感激。
最佳答案
如果将服务添加到每个组件的提供者，每个组件都会获得自己的服务实例。 Angular2 DI 为每个提供者维护一个实例。
如果将其添加到评论祖先的提供程序，则该组件和所有后代都会从此提供程序获取一个实例。
在 >= RC.5 中，如果您将服务添加到 任何 @NgModule(...) 的 providers: [...]不是延迟加载它将作为提供者添加到根注入(inject)器，因此与整个应用程序共享(只要任何后代组件也将其作为提供者并为其后代覆盖它)。
对于延迟加载模块，提供程序在此延迟加载模块内共享，因为延迟加载模块有自己的 DI 子作用域。
关于javascript - Angular2允许组件及其子组件访问服务中ngModel的单个实例，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39713717/