Using Template Reference variables in Angular 8 with Native Script in Dynamically in ngFor Directive then pass to function

<StackLayout*ngFor="let listItem of list; let i=index;" >

<StackLayout (tap)="onCheckbox(listItem, i, tv)" orientation="horizontal" horizontalAlignment="left">



<Label textWrap="true" verticalAlignment="center" text="Data"></Label>

</StackLayout>

<FlexboxLayout flexDirection="row" justifyContent="space-between" alignItems="center" >

<TextView #tv "[(ngModel)]="listItem.field" returnKeyType="done" autocorrect="true"></TextView>


</FlexboxLayout>

</StackLayout>


Typescript class file function
toggleCheckbox(item, index, textView: TextField) {

this.list = item;

this.inActionPNItemIndex = index;

textView.focus(); // Focused on Check the input field or dismissSoftkeyboard
}
So you can see how we event focus and close the keyboard access all method od native element

--

--

--

Software Engineer | Bharat Swabhiman Patanjali Social Activist | Speaker | Motivator | Yoga Trainer

Love podcasts or audiobooks? Learn on the go with our new app.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
ACHARYA ANIL SURYAVANSHI

ACHARYA ANIL SURYAVANSHI

Software Engineer | Bharat Swabhiman Patanjali Social Activist | Speaker | Motivator | Yoga Trainer

More from Medium

Pagination with RxJS state, and Route Params

Lesson 3 : components Output decorator

Reactively in javascript- Angular component as example

Generics in Typescript using Real time Example