Angular 2:组件输入/输出或更新服务属性

Eri*_*icC 3 angularjs

学习Angular 2并尝试理解何时应该使用组件输入/输出以及何时应该更好地更新服务属性(如果需要更新,可能附加一个EventEmitter).

我有一个列表,例如,任务,每个列表项显示此列表项的各种信息和选项.此列表的工作方式是只有一个列表项处于活动状态,而活动列表项位于列表顶部.每个列表项的其中一个选项是激活它(如果它尚未激活),但其他组件也可能更改哪个是活动项.

我有一个父task组件,list组件和list-item组件(以及一些其他相关组件),另外我有一个task-service.

主要task组件可以使用list组件(和something-realted组件,使用的许多组件需要知道并可能更改activeItemId),如下所示:

<list [(active-item-id)]=“activeItemId”></list>
<something-related [(active-item-id)]=“activeItemId”></something-related>
Run Code Online (Sandbox Code Playgroud)

list可以使用组件list-item这种方式(active是一个管道,并就项目的属性):

<list-item *ngFor=“#item of items | active” 
           (item)=“item”
           [(active-item-id)]=“activeItemId”>
</list-item>
Run Code Online (Sandbox Code Playgroud)

但由于我有一个task-service包含各种相关任务,我可以在服务上使用已经存在的activeItemId-property(具有eventemitter),并且所有各种任务组件都可以通过此属性获取信息(并进行更新),而不是通过输入/输出通过各种组件来回"发送"财产.

什么时候才能将服务用于这样的事情,何时适合使用组件的输入/输出?

Eri*_*icC 5

通过Angular Google网上论坛获得了很好的答案:

如果没有阅读完整的解释,我会说尽可能使用绑定,否则使用共享服务.

- 当两个组件不是直接父/子组件时,绑定是不可能的 - 组件由路由器添加 - 组件由DynamicComponentLoader添加

如果您同时在多个组件之间共享数据,即使其中一个或一些是直接子项,也可能更容易不使用绑定.

谢谢,Günter!