通过@output（）与孩子进行家长交流

Question

我的Parent Component中有一个表单，其中有一个用于输入新密码的隐藏输入和一个“编辑密码”按钮。

在Child Component中，通过单击“编辑密码”按钮，将加载matdialog，并输入输入新密码并保存。由于这是另一种形式，我应该将其传递给Parent Component。

任何人都可以帮助这个孩子与父母沟通吗？

子组件

@Output() editedPassword = new EventEmitter<String>();
  saveButtonClick(){
    this.editedPassword.emit(this.myform.get('password').value);
  }

如何将此值传递给父组件？

Answer 1

尝试一下：

子组件

@Output() editedEvent = new EventEmitter<String>();
  saveButtonClick(){
    this.editedEvent.emit(this.myform.get('password').value);
  } 

父HTML

<child-app (editedEvent)="eventHandler($event)"></child-app>

父组件

public newPassword: string = '';

eventHandler($event) {
  this.newPassword = $event;
}

您还可以看到完整的示例here。

此外，在Stackoverflow的此答案中，还提供了有关“角儿童与父母”交流的完整说明。