Restrict API Hitting Multiple times to 1 time on page load in Anuglar

import { Component, OnInit } from '@angular/core';

import { ApiService } from '../services/api-service.service';

@Component({

  selector: 'app-root',

  templateUrl: './app.component.html',

  styleUrls: ['./app.component.scss']

})

export class AppComponent implements OnInit {

 

  apiTimer: any;

 

  constructor(private apiservice: ApiService){

   

  }

  ngOnInit(): void{

     this.selectDropdown();

     this.searchClick();

  }

  selectDropdown() {

    if(!this.apiTimer){

      this.apiTimer = setTimeout(() => {

       this.getApiResult();

      }, 0);

      }

  }

  searchClick(){

    if(!this.apiTimer){

      this.apiTimer = setTimeout(() => {

       this.getApiResult();

      }, 0);

      }

  }

  getApiResult(){

    this.apiService.getApiResult(request: any).subscribe((data: any) => {

      this.result = data.result;

      if(this.apiTimer){

        this.apiTimer = undefined;

      }

    });

  }

 

}