Angular中的EventEmitter和Observables 在Angular中，EventEmitter和Observables是用于处理组件之间的事件和数据传递的重要工具。 EventEmitter是Angular框架中的一个类，用于在组件之
以下是一个使用EventEmitter和Observables的Angular示例代码：
- 在组件之间使用EventEmitter进行事件传递：
// child.component.ts import { Component, EventEmitter, Output } from '@angular/core';
@Component({
selector: 'app-child',
template:
})
export class ChildComponent {
@Output() customEvent = new EventEmitter();
emitEvent() { this.customEvent.emit('自定义事件'); } }
// parent.component.ts import { Component } from '@angular/core';
@Component({
selector: 'app-parent',
template:
})
export class ParentComponent {
handleEvent(data: string) {
console.log('接收到事件:', data);
}
}
- 使用Observables处理异步数据流：
// service.ts import { Injectable } from '@angular/core'; import { Observable } from 'rxjs';
@Injectable({
providedIn: 'root'
})
export class DataService {
private dataSubject = new BehaviorSubject
updateData(newData: string) { this.dataSubject.next(newData); } }
// component.ts import { Component } from '@angular/core'; import { DataService } from './service';
@Component({
selector: 'app-root',
template:
})
export class AppComponent {
data: string;
constructor(private dataService: DataService) { this.dataService.data$.subscribe((newData) => { this.data = newData; }); }
updateData() { this.dataService.updateData('新数据'); } } 在上述示例中，ChildComponent通过EventEmitter发射一个自定义事件，然后ParentComponent通过订阅这个事件来接收它。另外，DataService使用Observables来处理异步数据流，在AppComponent中通过订阅data$来接收更新的数据。
注意：示例中的代码可能需要根据实际情况进行修改和调整。