子コンポーネント : ts
export class ChildEditComponent {
@Output() childCreated = new EventEmitter<MyData>();
onButtonClicked(): void {
this.childCreated.emit(this.mydata);
}
}
childCreated を受け取る
親コンポーネント : html
<my-edit-article (childCreated)="consoleShow($event)"></my-edit-article>
親コンポーネント : ts
export class ParentEditComponent {
consoleShow(mydata: Mydata) {
console.log( mydata );
}
}
一番いいのはモデルを作成してそのモデルを渡す方法ですが、次のように複数渡すこともできます。
子コンポーネント : ts
@Output() childCreated = new EventEmitter<MyData>();
↓
@Output() childCreated = new EventEmitter<{ id: number; mydata:MyData }>();
this.childCreated.emit(this.mydata);
↓
this.childCreated.emit({
id: this.myid,
mydata: this.mydata,
});
親コンポーネント : ts
consoleShow(mydata: Mydata) {
console.log( mydata );
}
↓
consoleShow(childObj: any) {
console.log( childObj.id );
console.log( childObj.mydata );
}