如何在有角度的@input/@output 组件之间共享数据？答案

【问题标题】：how to share data between component with @input/@output in angular?如何在有角度的@input/@output 组件之间共享数据？
【发布时间】：2020-04-27 17:43:57
【问题描述】：

我想使用@Input 或@output 在组件之间共享数据，因为我只需要在后端共享不需要显示

【问题讨论】：

有还是没有？确保标题和描述匹配。
这能回答你的问题吗？ How to pass data between two components in Angular 2

标签： angular typescript

【解决方案1】：

如果您想在没有@input @output 的情况下在components 之间传递数据，那么您可以进行用户服务。

在data.service.ts你可以这样做

sharedData : any;

setData(data){
  this.sharedData = data;
}
getData(){
  return this.sharedData
}

在您的parent.component.ts 中，您可以像这样设置数据

constructor(private _dataService : DataService){}

this._dataService.setData(dataToBeShared);

在您的child.component.ts 中，您可以获得这样的数据

constructor(private _dataService : DataService){}

console.log(this._dataService.getData())

【讨论】：

【解决方案2】：

如果你想在没有@input @output 的组件之间传递数据，那么你可以使用服务。

在 share.service.ts 你可以这样做

search: EventEmitter < boolean > = new EventEmitter();
toggle(value:any) {
    this.search.emit(value);
}

你想要数据的组件：

ngOnInit() {    
  this.service.search.subscribe(value => {
       //some code here
  }
}

您共享数据的组件：

submit():void{
  this.service.toggle(somedata);
}

【讨论】：