Angularjs : 지시문 링크의 요소 선택 및 초점

Question

사용자 지정 지시문을 사용하여 텍스트 입력 필드를 선택하고 처음부터 집중 시키려고합니다.

입력 필드 :

<input type="text" value="Preset Value" select-on-load /> 

사용자 지침 :

app.directive('selectOnLoad', function() { 
// Linker function 
return { 
    restrict: 'A', 
    link: function (scope, element, attrs) { 
     element.focus().select(); 
    } 
}; 

});

하지만 초점/선택 기능을 말하는 javscript 오류가 발생합니다. 그 밖의 다른 방법은 무엇입니까?

Answer 1

Angular의 jqLite (jQuery의 내장 라이트 버전)는 .focus()을 지원하지 않습니다.

당신은 실제 DOM 요소를 취득하고 사용하는 데 필요한 자바 스크립트의 내장

element[0].focus() 

.focus() 그것이 .select()으로

(element[0]이 jqLite 래퍼 element에서 DOM 요소 개체를 가져옵니다) link 함수가 실행될 때까지 ng-model의 값이 아직 보간되어 DOM에 삽입되지 않았기 때문에 ng-model을 통해 오는 텍스트를 선택하려고하면 다소 번거 롭습니다.

당신은 다이제스트주기의 끝, 나는이 작업이 완료되는 것을 본 적이 일반적인 방법까지 기다릴 필요가 것입니다 $timeout를 통해 :

$timeout(function(){ 
    element[0].select(); 
});