How do i use a value from a settings.json in a .ts file in angular?

Question

i want to use debounceTime to let the user finish typing before suggestions are made. I want to make it customizable how much time the person is given before suggestions are made. To do that, i added a setting in my settings.json like this:

{
  "EN": {
    "workbaskets": {
      "time": {
        "debounceTime": 750
      },

I also exportet it as an interface in a settings.ts:

import { map } from 'rxjs/operators';
import { OperatorFunction } from 'rxjs';

export interface Customisation {
  [language: string]: CustomisationContent;
}

export interface CustomisationContent {
  workbaskets?: WorkbasketsCustomisation;
  classifications?: ClassificationsCustomisation;
  tasks?: TasksCustomisation;
}

export interface WorkbasketsCustomisation {
  information?: { owner: LookupField } & CustomFields;
  time?: DebounceTime;
  'access-items'?: AccessItemsCustomisation;
}

export interface DebounceTime {
  debounceTime: number;
}

Now I do not know how i can assign the value to debounceTime. I have tried the following in ngOnInit (i only include the relevant parts of code):

this.time = this.httpClient.get<DebounceTime>(customisationUrl).pipe(map((data) => {
      return data.debounceTime;
      })
    );

debounceTime(this.time)

I defined my variable as time: number = 0; outside of ngOnInit. However, that throws the following error:Type 'Observable' is not assignable to type 'number'. Now i am a new beginner in Angular and therefore i still do mot know alot. I tried reading through already existing questions, however could not solve my problem and therfore I would be thankful for any help. Since the application already used the settings.json and settings.ts, i would like to continue using this for this setting as well and just need help with how to use the value as input to the function debounceTime.

Answer 1

 this.httpClient.get<DebounceTime>(customisationUrl).pipe(map((data) => {
  
  }).subscribe((response)=>{
       this.time = data.debounceTime;
 });

You cannot return the data from the map operator. you can only modify the data in the map operator. on the subscribe method you can assign the property to your local class property. In case of any other questions let me know.