Search page 2.component.ts

Component variable instead of getter
export class SearchPageComponent implements OnInit {
  selectedOption = 'countries';
  searchTerm = '';

  results$: Observable<any[]> = of([]);
  results: any[] = [];

  loading: boolean = false;

  selectedComponent?: Type<any>;

  constructor(
    private countryApiService: CountryApiService,
    private journalApiService: JournalApiService
  ) {}

  ngOnInit() {}

  onSearch(): void {
    console.log(`Searching ${this.searchTerm}`);

    switch (this.selectedOption) {
      case 'countries':
        this.searchCountries();
        this.selectedComponent = CountryTableComponent;
        break;
      case 'journals':
        this.searchJournals();
        this.selectedComponent = JournalTableComponent;
        break;
    }
  }

  private searchCountries() {
    this.results$ = this.countryApiService.findByName(this.searchTerm);
    this.subscribe();
  }

  private searchJournals() {
    this.results$ = this.journalApiService.findByName(this.searchTerm).pipe(
      map((journalApiResponse: JournalApiResponse) => {
        return journalApiResponse.message.items;
      })
    );
    this.subscribe();
  }

  private subscribe(): void {
    this.loading = true;
    this.results$.pipe(take(1)).subscribe({
      next: (data) => {
        this.results = data;
      },
      complete: () => {
        this.loading = false;
      },
    });
  }

  get componentInput() {
    return {
      apiResults: this.results,
      loading: this.loading,
    };
  }
}