Angular 8:如何为同一组件的多个实例提供不同的服务实例

// 服务1：提供数据服务
@Injectable()
export class DataService {
  private data: string;

  setData(data: string) {
    this.data = data;
  }

  getData() {
    return this.data;
  }
}

// 服务2：提供日志服务
@Injectable()
export class LoggerService {
  log(message: string) {
    console.log(message);
  }
}

// 组件
@Component({
  selector: 'app-my-component',
  template: `
    <button (click)="setData('Data from Component 1')">Set Data</button>
    <button (click)="logData()">Log Data</button>
  `,
  providers: [DataService, LoggerService] // 注册服务
})
export class MyComponent {
  constructor(private dataService: DataService, private loggerService: LoggerService) {}

  setData(data: string) {
    this.dataService.setData(data);
  }

  logData() {
    const data = this.dataService.getData();
    this.loggerService.log(data);
  }
}