입력이 비어 있지 않고 입력이 완료 될 때까지 기다림

Question

사용자 입력이 비어 있지 않은 경우에만 서비스를 호출하고 사용자가 입력을 완료 할 때까지 약간의 지연이 필요합니다.

다음은 코드입니다. 도와주세요.

Component.ts

searchByName(event) { 

this.facilityService.searchFacilityName (event.target.value) .subscribe (시설 => = this.facilities 시설); 당신은 당신이 대기하는 시간, 즉 양 후 첫번째 시간 제한을 지정해야

Answer 1

이 도움이 될 것입니다,

this.testForm.controls.searchText.valueChanges.subscribe(x=>{ 
    if(this.testForm.controls.searchText.dirty && this.testForm.controls.searchText.valid) { 
    setTimeout(function(){ 
     this.searchFacilityName(this.testForm.controls.searchText.value) 
    },3000); 
    } }); 

Answer 2

}

Service.ts

searchFacilityName(name) { 
return this.http.get('http://localhost:8000/searchFacilityByName/' + name) 
    .map((response:Response) => response.json()) 
    .catch(
    (error: Response) => { 
     return Observable.throw('Something went wrong. Please try again.') 
    } 
); 

} 사용자가 입력을 중지했는지 확인하기위한 마지막 keyup 이벤트. 그 후에 당신은 당신의 구성 요소에서이

<input type='text' [ngModel]='userInput' (keyup)='checkTimeLimit()' (keydown)='typeCheck = typeCheck + 1'> 

을 시도 할 수 있습니다 :

typeCheck = 0; 
userInput; 
timeLimit = 5000; // It is the time limit after which you consider that user has stopped typing (5s) 

checkTimeLimit() { 
    const temp = this.typeCheck; 
    setTimeout(() => { 
    if (temp === this.typeCheck) { // It checks whether the user has pressed another key before the specified time limit 
     this.typeCheck = 0; 
     this.searchFacilityName(userInput); 
    } 
    }, this.timeLimit); 
}