Question

请查看我的图片。

在输入字段中输入数据并点击键盘后输入/ Go按钮后，它没有做任何事情，它表现得很理想。

是否有任何插件可以控制键盘（输入，搜索，go..etc）按钮，就像（点击）功能一样。如何激活每个输入字段中的输入/转到按钮？。

更新

这是我的HTML代码

  <ion-item>
      <ion-label primary floating>Email/Mobile</ion-label>
      <ion-input type="text" [(ngModel)]="loginId" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$" required></ion-input>
    </ion-item>

    <ion-item>
      <ion-label primary floating>Password</ion-label>
      <ion-input type="password" [(ngModel)]="passwd" required></ion-input>
    </ion-item>

    <p>{{loginMsg}}</p>


  <div padding>
  </div>

  <button ion-button full color="light" (click)="submit();" >LOGIN</button> <br>

  <div class="text" (click)="forgotPasswd()">

  <p > Forgot your password ?</p>
  </div>

  <div padding>
  </div>

  <div class="text-padding-bottom" (click)="registration();">
    <p > No account yet ? <b>Create One</b></p>
  </div>

如果您看到我的某个页面有输入类型=“搜索”，我可以在键盘上找到搜索按钮，但该按钮也显示理想这是它的代码。

<ion-row>
        <ion-col width-80>
            <ion-item>
                <ion-input type="search" placeholder="search products"[(ngModel)]="searchValue"></ion-input>
            </ion-item>
        </ion-col>
        <ion-col width-20>
            <button ion-button icon-only (click)="searchText();"> 
              <ion-icon name="search"></ion-icon>
            </button>
        </ion-col>
    </ion-row>

Answer 1

我得到了输出。复制表单中的html代码并使用(submit)提交表单。另外，正如评论中所建议的那样，我们必须使用type =“submit”作为按钮才能在键盘上执行按钮。

<form (submit)="submit()">
<ion-item>
      <ion-label primary floating>Email/Mobile</ion-label>
      <ion-input type="text" [(ngModel)]="loginId" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$" required></ion-input>
    </ion-item>

    <ion-item>
      <ion-label primary floating>Password</ion-label>
      <ion-input type="password" [(ngModel)]="passwd" required></ion-input>
    </ion-item>

    <p>{{loginMsg}}</p>


  <div padding>
  </div>

  <button ion-button full color="light" type="submit">LOGIN</button> <br>

  <div class="text" (click)="forgotPasswd()">

  <p > Forgot your password ?</p>
  </div>

  <div padding>
  </div>

  <div class="text-padding-bottom" (click)="registration();">
    <p > No account yet ? <b>Create One</b></p>
  </div>
</form>

试一试。

Answer 2

您也可以通过事件 KeyPress

<ion-input clear-input (keypress)="eventHandler($event.keyCode)"></ion-input>

并在用户按下设备上的回车键时执行该函数

eventHandler(keyCode) {
  console.log('keyCode: ', keyCode);
  if (keyCode == 13) {
   /* code */
  }
}

如何让键盘进入/退出按钮工作

2 个答案: