angular子组件触发父组件方法

在Angular中，子组件可以通过`@Output()`装饰器定义一个事件，并通过` EventEmitter`类型来触发这个事件。当子组件需要通知父组件时，通常会调用这个事件并传递数据。父组件可以通过`@Input()`或`@ViewChild`绑定到这个事件，从而在父组件的方法中接收并处理这个通知。

具体步骤如下：

1. 在子组件的类中，定义一个`@Output()`装饰器，比如`clickEvent = new EventEmitter<any>();`，这表示子组件有一个名为`clickEvent`的输出事件。

import { Component, Output, EventEmitter } from '@angular/core';

@Component({
  // ...
})
export class ChildComponent {
  @Output() clickEvent = new EventEmitter<any>();
  
  // 子组件触发方法
  triggerParentMethod() {
    this.clickEvent.emit('Data to send to parent');
  }
}

2. 在父组件的模板中，使用`<ng-template>`或`<ng-container>`将子组件包含起来，并通过`(clickEvent)="parentMethod($event)"`这样的绑定来监听子组件的事件。

<app-child [someInput]="parentValue" (clickEvent)="parentMethod($event)"></app-child>

3. 在父组件的类中，定义`parentMethod`方法来接收和处理从子组件发送的数据。

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

@Component({
  // ...
})
export class ParentComponent {
  parentValue: any;
  
  // 父组件的方法
  parentMethod(data: any) {
    console.log('Received data:', data); // 这里处理接收到的数据
  }
}