cordova - 在 Ionic 2 中，如何在键盘显示时将元素 float 到键盘上方？

Question

我希望我的消息输入栏在键盘显示时 float 在键盘上方，但看起来没有 keyboard-attach directive (like v1)在 Ionic 2 中(maybe in the works？)。有任何替代/解决方法吗？

当前行为:

通缉行为:

这是我的消息输入栏的代码:

<ion-toolbar position="bottom" *ngIf="userIsAdmin">

    <form (ngSubmit)="onSubmit(f)" #f="ngForm" class="message-form">

        <ion-badge class="message-form-badge">Admin</ion-badge>

        <ion-input type="text" placeholder="Type a message..." ngControl="messageInput"></ion-input>

        <button type="submit" small class="message-form-button">Send <ion-icon name="send"></ion-icon></button>

    </form>

</ion-toolbar>

Answer 1

我找到了适用于 IOS 的解决方案。

当您检查 <ion-item>与 <ion-input>在浏览器中(调试使用 IOS 的 Safari)你可以发现 ionic 生成了一个 <div class='input-cover'>其风格为 position: absolute; .

编写一个 CSS 来覆盖它，如下所示

.input-cover {
  position: static;
}

这对我有用，现在当你专注于一个输入字段时，它会滚动到 View 中并且不再隐藏在键盘下方，所有这一切都非常顺利。