1. 使用服务(Service)来共享数据 在一个服务中定义一个属性，用来存储要共享的数据。然后在需要访问这个数据的组件中注入该服务。这样，在任何组件中修改服务中的数据，其他组件就可以访问到这些修改后的数据。 例如，定义一个DataService服务来共享数据：

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

@Injectable({ providedIn: 'root', }) export class DataService { sharedData: any;

constructor() { } }

在组件中注入该服务，并在需要使用共享数据的组件中使用该服务：

import { Component } from '@angular/core'; import { DataService } from './data.service';

@Component({ selector: 'app-child', template:

{{ sharedData }}

constructor(private dataService: DataService) { this.sharedData = this.dataService.sharedData; }

changeData() { this.dataService.sharedData = 'New shared data'; } }

2. 使用@Input()和@Output()来共享数据 @Input()用来在父组件中将数据传递给子组件。@Output()用来在子组件中将数据传递给父组件。 例如：

// 父组件 import { Component } from '@angular/core';

@Component({ selector: 'app-parent', template: , }) export class ParentComponent { data = 'Shared data';

handleOutput(data) { console.log(data); } }

// 子组件 import { Component, Input, Output, EventEmitter } from '@angular/core';

@Component({ selector: 'app-child', template:

{{ inputData }}