在
Angular 中，有几种方法可以实现
组件之间的数据传递：
1.使用 @Input() 装饰器：通过在父
组件中声明一个属性，并使用 @Input() 装饰器将其传递给子
组件，子
组件可以使用这个属性进行渲染或其他操作。
例如，在父
组件中定义一个名为 "parentData" 的属性，并将其传递给子
组件：
```
<app-child [childData]="parentData"></app-child>
```
然后，在子
组件中使用 @Input() 装饰器接收这个属性：
```
@Input() childData: any;
```
2.使用 @Output() 装饰器：通过在子
组件中定义一个 EventEmitter 属性，并使用 @Output() 装饰器将其传递给父
组件，子
组件可以通过调用该属性的 emit() 方法来触发事件，父
组件可以监听这个事件并进行相应的操作。
例如，在子
组件中定义一个名为 "childEvent" 的 EventEmitter 属性：
```
@Output() childEvent: EventEmitter<any> = new EventEmitter();
```
然后，在子
组件中触发该事件：
```
this.childEvent.emit(data);
```
最后，在父
组件中监听该事件并进行相应的操作：
```
<app-child (childEvent)="onChildEvent($event)"></app-child>
```
```
onChildEvent(data) {
// 进行相应的操作
}
```
3.使用服务：通过在一个服务中定义公共的数据或方法，然后在需要访问这些数据或方法的
组件中注入该服务，可以实现
组件之间的数据共享。
例如，在一个名为 "dataService" 的服务中定义一个名为 "sharedData" 的公共属性：
```
@Injectable()
export class DataService {
sharedData: any;
}
```
然后，在需要访问该属性的
组件中注入这个服务并使用它：
```
constructor(private dataService: DataService) {}
ngOnInit() {
this.sharedData = this.dataService.sharedData;
}
```
这些是
Angular 中实现
组件之间数据传递的常用方法，开发者可以根据实际情况选择合适的方式。
扫一扫
705
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
