3

I have a button like below which opens a modal when I press "space"

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

and I want to set focus on a input field like below

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

the openLg func is

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

}

I have also import renderer2

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

constructor(private renderer: Renderer2){}

but when I am pressing the space button it is show me the following error

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)

What is the solution? what am I doing wrong?

Shuvo Barua
  • 105
  • 2
  • 10
  • I tried to reproduce your issue here: https://stackblitz.com/edit/angular-ivy-hawgm4?file=src/app/app.component.ts. It is working fine for me. Could you please share a minimal reproducible code in stackblitz.com? – smtaha512 Nov 22 '20 at 13:11
  • sorry for my late reply @smtaha512. The problem was in the modal. for some reason it was not focusing on modal input. I used ngbAutofocus. thanks. – Shuvo Barua Dec 03 '20 at 05:49

1 Answers1

0

The problem was in the modal. for some reason it was not focusing on modal input. I used ngbAutofocus.

Shuvo Barua
  • 105
  • 2
  • 10