孩子更新父母的'角度方式'是什么?

时间:2017-07-28 09:17:28

标签: javascript angular web-component eventemitter viewchild

似乎有一些方法可以剥掉这只猫,但我想知道最好的(练习)和原因。

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

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

我相信还有更多。对于非基于表单的组件,我觉得使用Event发射器是最Angulary要做的事情。但我无法用良好的技术基础来解释原因。想法?

1 个答案:

答案 0 :(得分:2)

    当没有其他选项的具体原因时,
  • @Output()是连接孩子与父母的第一件事。
    它在组件之间创建最少量的耦合。如果要在另一个父组件中使用子项,这是最简单的方法。这就是Angular组件的所有内容 - 可重用性。

  • 共享服务是另一种选择,特别是在没有直接父子关系时。

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

<强>避免

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

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