Блог

У меня есть кнопка, подобная приведенной ниже, которая открывает модальный режим, когда я нажимаю «пробел»

 <button type="button" (keydown.space)="openLg()" class="btn btn-link"></button>
 

и я хочу установить фокус на поле ввода, как показано ниже

 <input class="form-control" type="text" id="amount" name="amount" [(ngModel)]="totalAmt_modal">
 

функция openLg

 openLg() { 
    
 this.renderer.selectRootElement('#amount').focus();

}
 

У меня также есть import renderer2

 import { Component, OnInit, Renderer2} from '@angular/core';

constructor(private renderer: Renderer2){}
 

но когда я нажимаю кнопку пробела, это показывает мне следующую ошибку

 core.js:4352 ERROR Error: The selector "#amount" did not match any elements
    at EmulatedEncapsulationDomRenderer2.selectRootElement (platform-browser.js:679)
    at BaseAnimationRenderer.selectRootElement (animations.js:267)
    at VoucherentryComponent.setfocus (voucherentry.component.ts:347)
    at VoucherentryComponent.openLg (voucherentry.component.ts:320)
    at VoucherentryComponent_tr_52_Template_button_keydown_space_2_listener (voucherentry.component.html:75)
    at executeListenerWithErrorHandling (core.js:15214)
    at wrapListenerIn_markDirtyAndPreventDefault (core.js:15249)
    at platform-browser.js:582
    at platform-browser.js:1281
    at ZoneDelegate.invoke (zone-evergreen.js:364)
 

Каково решение? что я делаю не так?