将数据 onChange 从 child 传递到 parent？ Angular

Question

我需要将数据从 child 传递到 parent，但需要更改。

Child 组件代码：

  <input type="file" name="file" accept="image/*"
        (change)="handleInputChange($event)">

Parent 分量：

 <app-file-uploader></app-file-uploader>  //this is child component

我需要将 ($event) 传递给 parent 组件。

Answer 1

您需要使用 Angular 的 Output() 指令。这是如何完成的：

首先： 在您的子组件中，添加以下导入语句：

import { Output } from '@angular/core';

其次：在子组件class中：添加如下内容属性：

@Output() onChange = new EventEmitter<any>();

现在在您的 handleInputChange($event) 中，您需要发出 onChange 属性:

handleInputChange($event){
    // ... all of your logic
    this.onChange.emit($event); // this will pass the $event object to the parent component.
}

最后：在你的父组件模板中，你可以这样调用你的组件：

<app-file-uploader (onChange)="callSomeFunction($event)"></app-file-uploader>

注意： 将 callSomeFunction 替换为您调用的任何函数。

这里是关于如何使用 Output() 的Angular Documentation。希望这个回答对你有帮助！

将数据 onChange 从 child 传递到 parent？ Angular

Passing Data onChange from child to parent? Angular

javascript

communication

angular