typescript - 如何在 angular 2 中将一个组件的服务响应传递给另一个组件

我刚接触 Angular 4，在一个组件中从服务器获取响应，我想在另一个组件中使用这个响应对象，应该如何访问

app.component.ts：

export class AppComponent {
  selected;
  skipCount: number = 0;
  errorMessage: string;
  searchedResults: any;

  searchObj: Object = {
    skipCount: this.skipCount
  };

  onChange(newVlaue){
    console.log(newVlaue);
    this.selected = newVlaue;
  }

  constructor(
    private searchService: searchService,
    private router: Router) {}

  searchall() {
    console.log(this.searchObj);

    var searchData = this.searchObj;
    console.log(searchData);

    this.searchService.getSearchbyDistrictCategoryCity(this.searchObj)
      .subscribe(
        data => {
          this.searchedResults = data;
          console.log(this.searchedResults);
          this.router.navigate(['/searchdetails/'])
        },
        error => this.errorMessage = <any>error);
  }
}

我想在其他组件中获取 searchedResults 变量的结果，比如搜索详情，如何获取这个？

谢谢！

答案＃1

您可以将搜索结果保存在您的 searchService 中，并从那里获取。为此，只需在您的服务中添加 searchResults 属性，并使用当前的搜索结果更新它。它看起来像下面这样：

export class SearchService {
  public searchResults;

  ... 
}

每当你想更新搜索结果时，你可以这样做： ```

this.searchService.getSearchbyDistrictCategoryCity(this.searchObj).subscribe(data=>{
  this.searchedResults = data;
  this.searchService.searchResults = data; 
},error=>this.errorMessage= <any>error);

你也可以重写你的搜索功能，使你在服务中找到结果时自动更新 searchResults 属性。

在另一个组件中，你可以直接使用服务中的属性

this.searchedResults = this.searchService.searchResults;

如果你希望组件能够随着新日期自动更新，你要么必须将 userService 直接绑定到输入框，要么为数据更改添加监听器。