javascript - child 更新 parent 的 'Angular way' 是什么？

Question

似乎有几种方法可以给这只猫剥皮，但我想知道最好的(做法)以及原因。

如果我想在 child-cmp 中收集一些数据并将其传递给 parent-cmp，我可以:

• 用父函数包装一个对象并将其作为输入传递给 child ，在输入上调用函数。
• 在 child-cmp 中创建一个 EventEmitter 函数并发出结果，在 parent-cmp 中收集数据。
• 通过@ViewChild()访问child，直接调用它的方法。
• 使用要收集的数据创建一个 ngModel(仅在表单中？)

我相信还有更多。对于非基于表单的组件，我觉得使用事件发射器是最 Angulary 的事情。但是我无法真正解释为什么具有良好的技术基础。想法？

Answer 1

• @Output() 是连接 child 与 parent 的第一个选择，当没有其他选择的具体原因时。
  它在组件之间创建最少的耦合。如果你想在另一个父组件中使用子组件，这是最简单的方法。这就是 Angular 组件的全部 - 可重用性。

• 共享服务是另一种选择，尤其是当没有直接的父子关系时。

• *ngModel(在子组件中实现 ControlValueAccessor)是一个好主意，如果该组件应该在表单中使用的话。

避免

• 使用 @ViewChild() 获取子组件的引用会使父组件依赖于实现特定接口(interface)的子组件。

• 用函数包装对象(或以其他方式传递方法或对象引用)
  传递方法会引入强耦合。使用共享服务。共享服务也是一个带有方法的类实例，但它是 Angular 中每个开发人员都习惯的标准方式，而且更明确。要将更新推送到参与的组件，请使用