angular - 从通过 ng-content 投影的子组件内的父组件接收事件

Question

考虑这种简化的情况，我们有：

父组件模板（选择器：'parent'）：

<div class="wrapper">
  <input (blur)="onBlur()"/>
  <ng-content></ng-content>
</div>

子组件模板（选择器：'child'）：

<div>{{ valueEmittedFromParentInputOnBlurEvent }}</div>

用法，页面某处：

<parent>
  <child></child>
</parent>

在 onBlur() 事件中发出后，我想valueEmittedFromParentInputOnBlurEvent在我的组件中进行处理。child如果可以，请你帮助我：）

score 0 · Accepted Answer

0

您可以使用服务或为子组件提供输入。

于 2020-12-02T11:56:26.637 回答

score 0 · Accepted Answer

按照这个概念在父母和孩子之间进行沟通：

<child #child></child>
<input (blur)="child.onBlurEvent()"/>

您将子组件定义为 #child 以访问其方法，例如 onBlurEvent()

number = 0;
onBlurMethod() {
    this.number++;
}

<h1>{{number}}</h1>

当 onBlur 事件发生在您的父级中时，它将在子级中调用 onBlurEvent 方法，该方法将执行它必须执行的任何操作

这是一个帮助您了解亲子沟通的示例，这个概念将帮助您解决问题，祝您好运

2 回答 2