JavascriptのchildNodesにフォーカスを追加する方法

Question

UL Html要素でナビゲーションを作成しようとしています。私はこれやった

：コンソールで

let htmlUL = <HTMLElement>document.getElementById('autocomplete_ul_' + this.name); 
if (arg.keyCode == 40) { // down arrow 
    if (this.arrowPosition < htmlUL.childNodes.length) 
     this.arrowPosition++; 
    console.log(htmlUL.childNodes[this.arrowPosition]); 

} else if (arg.keyCode == 38) { //up arrow 

    if (this.arrowPosition >= 2) 
     this.arrowPosition--; 

    console.log(htmlUL.childNodes[this.arrowPosition]); 
} 

を私はUPとDOWNを押すと、私は正しいデータを参照してください。

しかし、私は作ることができないhtmlUL.childNodes[this.arrowPosition].focus()： Property 'focus' does not exist on type 'Node'

どのように私は私のchildNodes要素に焦点を当てることができますか？あなたはHTMLElementを入力する子要素をキャストする必要があり感謝

Answer 1

：

const id = `autocomplete_ul_${this.name}`; 
const htmlUL = document.getElementById(id) as HTMLElement; 

if (arg.keyCode === 40) { // down arrow 
    if (this.arrowPosition < htmlUL.childNodes.length) { 
     this.arrowPosition++; 
    } 
} else if (arg.keyCode === 38) { //up arrow 
    if (this.arrowPosition >= 2) { 
     this.arrowPosition--; 
    } 
} 
const child = htmlUL.childNodes[this.arrowPosition] as HTMLElement; 
child.focus(); 

OT：あなたは、タグAngularと疑問タグ付けされ、したがって、あなたは、リスト要素にViewChildを使用して角度ウェイを取得する必要がありますデコレータの代わりにdocument.getElementByIdを使用します。