RxJs: How to properly debounce?

Question

JavaScript

Good time of the day!
I need the method (this.goToProc(proc)) to be called no more than half a second.
I try like this:

...
import {debounceTime} from 'rxjs/operators';
...
  ngOnInit(): void {
    this.dataService.proc.subscribe({
      next: (proc) => {
        this.dataService.proc.pipe(
          debounceTime(500)
        ).subscribe(e => this.goToProc(proc));
      }
    });
  }

But he makes a delay of half a second and calls all the calls that came. Likewise if:

...
import {debounce } from 'rxjs/operators';
import { timer } from 'rxjs';
...
  ngOnInit(): void {
    this.dataService.proc.subscribe({
      next: (proc) => {
        this.dataService.proc.pipe(
          debounce(() => timer(500))
        ).subscribe(e => this.goToProc(proc));
      }
    });
  }

How to properly debounce?

Answer 1

auditTime