각도 2 - keyUp 이벤트 디버깅

Question

"keyUp"이벤트에서 호출되는 함수를 디버깅하려면 어떻게해야합니까? 여기

내 코드입니다 :

내 기능

private handleSearch(searchTextValue: string, skip?: number): void { 
    this.searchTextValue = searchTextValue; 
    if (this.skip === 0 || typeof skip === "undefined") { 
     this.skip = 0; 
     this.pageIndex = 1; 
    } else { 
     this.skip = skip; 
    } 
    this.searchTextChanged.emit({ searchTextValue: searchTextValue, skip: this.skip, take: this.itemsPerPage }); 
} 

내 HTML

<input type="text" class="form-control" placeholder="{{ 'searchquery' | translate }}" id="searchText" #searchText (keyup)="handleSearch(searchText.value)"> 

Bassically 내가 무엇을 달성하기 위해 노력하고있어 handleSearch이를 호출되는 것입니다 사용자가 타이핑을 중단 한 후 잠시.

나는 로다시의 _debounce()을 사용할 수 있다고 알았지 만, 이걸 내 keyUp 이벤트에 넣는 방법을 찾지 못했습니다.

Answer 1

rxjs/Subject를 만들고 keyup에서 .next()를 호출하고 원하는 debounceTime으로 구독 할 수 있습니다.

올바른 방법인지는 모르겠지만 작동 여부는 확실하지 않습니다.

private subject: Subject<string> = new Subject(); 

ngOnInit() { 
    this.subject.debounceTime(500).subscribe(searchTextValue => { 
    this.handleSearch(searchTextValue); 
    }); 
} 

onKeyUp(searchTextValue: string){ 
    this.subject.next(searchTextValue); 
} 

HTML :

<input (keyup)="onKeyUp(searchText.value)">