angular组件间的父子传值

在 Angular 中，组件间的父子传值可以通过输入属性（@Input）和输出属性（@Output）来实现。

1. 父组件向子组件传值（通过输入属性）：
- 在子组件的类中，使用 `@Input()` 装饰器定义一个输入属性，例如 `@Input() value: string;`。
- 在父组件的模板中，使用子组件的标签，并通过绑定属性的方式将值传递给子组件，例如 `<app-child [value]="parentValue"></app-child>`。

2. 子组件向父组件传值（通过输出属性和事件）：
- 在子组件的类中，使用 `@Output()` 装饰器定义一个输出属性，并创建一个事件发射器，例如 `@Output() valueChange: EventEmitter<string> = new EventEmitter<string>();`。
- 在子组件中的某个适当的时机，调用事件发射器的 `emit()` 方法来触发事件，并传递需要传递给父组件的值，例如 `this.valueChange.emit(newValue);`。
- 在父组件的模板中，使用子组件的标签，并绑定相应的事件处理函数来接收子组件发出的事件，例如 `<app-child (valueChange)="onChildValueChange($event)"></app-child>`。在父组件的类中，实现名为 `onChildValueChange()` 的事件处理函数来处理子组件传递过来的值。

通过上述方式，父组件和子组件之间可以进行简单和复杂的数据传递，并实现双向通信。这种组件通信的方式可以有效地在 Angular 应用程序中传递和共享数据，以实现组件之间的交互和协作。