Angular2/Nativescript:在软键盘上按下return键时提交表单
Angular2/Nativescript: Submit a form when return key is pressed on soft keyboard
我有一个带有用户名和密码 TextFields 的 Angular2/Nativescript 登录组件...在编辑密码 textField 时,我将 returnKeyType 设置为 "done" 并期望登录( ) 在软键盘上按下 Done 时调用的函数。在按下完成的那一刻,键盘被关闭但登录功能没有被调用所以我仍然必须在键盘关闭后点击登录按钮才能提交表单。当在 Nativescript 中的特定 TextField 上按下 return 键时,有什么方法可以提交表单吗?如果是这样,我该如何着手实施它?我尝试了 return 新闻事件,但没有任何反应...
我的代码:
<ActionBar title="Login"></ActionBar>
<StackLayout class="page">
<GridLayout columns="*, auto" rows="auto">
<ActivityIndicator class="m-l-10 m-t-10 activity-indicator" [busy]="busy" [visibility]="busy ? 'visible' : 'collapse'" horizontalAlignment="left"></ActivityIndicator>
<Button row="0" col="1" id="setIPBtn" class=" m-t-20 pull-right font-awesome" text=" Settings" (tap)="setIP()"></Button>
</GridLayout>
<Label class="m-x-auto m-t-20 title h1 text-primary p-x-10" text="Log In" backgroundColor="blue"></Label>
<StackLayout class="form">
<StackLayout class="input-field">
<Label class="body label text-left" text="Enter Username"></Label>
<TextField class="input input-border" hint="Username" [(ngModel)]="username" autocorrect="false" autocapitalizationType="none" returnKeyType="next"></TextField>
</StackLayout>
<StackLayout class="input-field">
<Label class="body label text-left" text="Enter Username"></Label>
<TextField class="input input-border" secure="true" hint="Password" [(ngModel)]="password" autocorrect="false" autocapitalizationType="none" returnKeyType="done" returnPress="login()"></TextField>
</StackLayout>
<Button class="btn btn-submit font-awesome bg-primary" [text]="isLoggingIn ? 'Logging in...' : ' Login'" (tap)="login()" [isEnabled]="username !== '' && username !== null && password !== '' && password !== null && !isLoggingIn"></Button>
</StackLayout>
</StackLayout>
试试这个:
(returnPress)="login()"
我有一个带有用户名和密码 TextFields 的 Angular2/Nativescript 登录组件...在编辑密码 textField 时,我将 returnKeyType 设置为 "done" 并期望登录( ) 在软键盘上按下 Done 时调用的函数。在按下完成的那一刻,键盘被关闭但登录功能没有被调用所以我仍然必须在键盘关闭后点击登录按钮才能提交表单。当在 Nativescript 中的特定 TextField 上按下 return 键时,有什么方法可以提交表单吗?如果是这样,我该如何着手实施它?我尝试了 return 新闻事件,但没有任何反应...
我的代码:
<ActionBar title="Login"></ActionBar>
<StackLayout class="page">
<GridLayout columns="*, auto" rows="auto">
<ActivityIndicator class="m-l-10 m-t-10 activity-indicator" [busy]="busy" [visibility]="busy ? 'visible' : 'collapse'" horizontalAlignment="left"></ActivityIndicator>
<Button row="0" col="1" id="setIPBtn" class=" m-t-20 pull-right font-awesome" text=" Settings" (tap)="setIP()"></Button>
</GridLayout>
<Label class="m-x-auto m-t-20 title h1 text-primary p-x-10" text="Log In" backgroundColor="blue"></Label>
<StackLayout class="form">
<StackLayout class="input-field">
<Label class="body label text-left" text="Enter Username"></Label>
<TextField class="input input-border" hint="Username" [(ngModel)]="username" autocorrect="false" autocapitalizationType="none" returnKeyType="next"></TextField>
</StackLayout>
<StackLayout class="input-field">
<Label class="body label text-left" text="Enter Username"></Label>
<TextField class="input input-border" secure="true" hint="Password" [(ngModel)]="password" autocorrect="false" autocapitalizationType="none" returnKeyType="done" returnPress="login()"></TextField>
</StackLayout>
<Button class="btn btn-submit font-awesome bg-primary" [text]="isLoggingIn ? 'Logging in...' : ' Login'" (tap)="login()" [isEnabled]="username !== '' && username !== null && password !== '' && password !== null && !isLoggingIn"></Button>
</StackLayout>
</StackLayout>
试试这个:
(returnPress)="login()"