假设我有3个Angular组件,第一个组件使用第二个和第三个组件作为指令。它们应该共享相同的模型对象,该对象在第一个组件中初始化。如何将该模型传递给第二和第三个组件?我引用了这篇文章How to pass object from one component to another in Angular 2?,但它正在使用输入...我想知道在各种子组件之间共享模型对象的所有可能的替代方法 有人请告诉我可以遵循的替代方案
答案 0 :(得分:1)
将类型添加到First
组件的提供者列表中,并将其注入@Component({
...
providers: [SharedService]
})
export class First {
constructor(private shared: SharedService);
// also add this parameter to the other child and grand-child
// component and directives constructors and they will get
// passed a shared instance.
}
的构造函数,涉及的子项和孙项构造器。
SharedService
不要将providers
添加到任何子项或子项SharedService
中,否则他们将获得新实例而不是共享实例。
如果将bootstrap(AppComponent, [SharedService])
添加到SharedService
而不是父组件,则整个应用程序将共享seam {{1}}实例,而不仅仅是选定的子树。
答案 1 :(得分:0)
在子项(而不是共享服务)上使用输入属性的一个优点是Angular更改检测会自动将更改传播到子项。如果您使用不可变对象并且想要更改整个模型(到新实例/引用),这将非常有用。
使用服务,您可以更改模型,但不能更改模型参考。
使用输入属性,您可以执行以下任一操作:更改模型和/或更改模型参考。
有关使用不可变数据建模的更多信息,请参阅以下Savkin博文:http://victorsavkin.com/post/133936129316/angular-immutability-and-encapsulation