Angular 2 - 在 ngOnInit() 中订阅的 observable 太多

Question

我有一个巨大的模型驱动表单，它的字段可能会影响彼此的行为，例如：

如果字段A的值发生变化，则应该从服务器获取字段B的值，或者如果字段C的值发生变化，则应该禁用字段D等

为了检测我使用 valueChanges 的变化：

this.form.controls['a'].valueChanges.subscribe(data=>{
    //do some staff
});
this.form.controls['b'].valueChanges.subscribe(data=>{
    //do some staff
});
.
.
.

（请注意，我不能说this.form.valueChanges，因为我的表单有大约 50 个字段）。一切看起来都很好，但这种方法让我的ngOnInit() 有点乱。我的问题是：

对于这种情况有没有更好/更有效的解决方案？在 ngOnInit 中订阅过多的 observables 不会产生任何问题？如何改进我的代码？

Answer 1

在模板上使用 angular event binding 会更简洁。结合 ngModel 进行双向数据绑定，它可以让你的组件代码更加简洁。

例如：

<input type="text" formControlName="a" [(ngModel)]="inputValue" (change)="doSomething($event)">

您可以在 Angular2 中为 DOM 事件执行 event binding，例如 change、click、keyup、blur 等。

编辑：

• change 仅在单击输入文本框外部时触发。
• 与change 相比，keyup 是更好的选择。

查看此Plunk 以比较差异。