각도 또는 각도에서 자동 초점을 설정하는 방법

Question

지시문 또는 HTML 자동 초점을 작성하여 angularjs 입력 필드에 자동 포커스를 설정하는 방법에 대한 여러 게시물을 볼 수 있습니다. 각도로 초점을 설정하는 빠르고 쉬운 방법이 있습니까? 각 2, 각 4 등)는 HTML 구성 요소 코드에서 해당 참조를 얻을 수 #nameit를 추가에서

Answer 1

.

<input type="text" name="me" #nameit> 

다음으로 자동 접착 장치를 부착하십시오.

@ViewChild('nameit') private elementRef: ElementRef; 

    public ngAfterViewInit(): void { 
    this.elementRef.nativeElement.focus(); 
    } 

Answer 2

<input type="text" #textInput placeholder="something" (focus)="someFunction(textInput.value)"/> 

또는

<input type="text" #textInput placeholder="something" (keyup.enter)="someMethod(textInput.value)"/> 

Answer 3

일부 경우에는 Aniruddha Das 응답이 잘 작동합니다. 이 필요한 유효성 검사 템플릿 기반 양식에 적용되는 경우, 다음과 같은 오류가 나타날 수 있습니다 이것에

ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after >it was checked. Previous value: 'false'. Current value: 'true'.

하나 개의 솔루션이 ngInit (내 초점() 호출을 포장한다

) 대신 ngAfterViewInit의() . 그래서, Aniduddha의 대답에 연장 : 당신의 HTML에서

구성 요소에 #namedReference을 추가

<input type="text" 
    placeholder="Your full name" 
    name="name" 
    ngModel 
    #fullName="ngModel" 
    required 
    #nameit> 

을 그것으로 자동 초점을 적용 onNgInit()를 사용하여 다음 :

@ViewChild('nameit') private elementRef: ElementRef; 

ngOnInit() { 
    this.elementRef.nativeElement.focus(); 
} 

Answer 4

을 할 수 가장 많이 투표 한 답변의 예를 사용하십시오. 그러나 때때로 "비동기"호출을 위해 setTimeout에 집중해야합니다. 내 경우에는 각도 소재의 매트 자동 완성 구성 요소의 선택된 필터에 setTimeout을 넣어야합니다. 이

setTimeout(() => this.qtdeRef.nativeElement.focus());