Question

我试图在Android设备上调试我的应用程序，但我遇到了这个奇怪的问题，点击输入字段时弹出的键盘将整个页面内容（包括底部的标签）推送到顶部。我可能会错过一些愚蠢的东西。请帮助我。我经历了许多不太清楚的链接，有些链接不起作用。

这是我的html文件：

<ion-header>
<ion-navbar>
    <div class="titleicon">
        <img src="assets/logo.png" width="150px" style="display:inline-block" height="40px" (click)="LogoClick()" />
    </div>
    <button ion-button>
  <ion-icon name="menu"></ion-icon>
</button>
</ion-navbar>

<div class="bgimg" style="background:url('assets/bg.png'); background-position: 0 -70px;">
    <div class="inner">
        <ion-item>
            <ion-input type="text" placeholder="Enter Keyword" [(ngModel)]="searchText" (ngModelChange)="textChanged($event)"> </ion-input>
        </ion-item>
        <ion-item>
            <ion-label> Branch</ion-label>
            <ion-select>
                <ion-option *ngFor="let branchObj of Branches" [value]="branchObj">
                    {{branchObj.name}}
                </ion-option>
            </ion-select>
        </ion-item>
        <ion-item>
            <ion-label>Subject</ion-label>
            <ion-select>
                <ion-option *ngFor="let subjectObj of subjects" [value]="subjectObj">
                    {{subjectObj.name}}
                </ion-option>
            </ion-select>
        </ion-item>
        <ion-item>
            <ion-label>
                Type of Course
            </ion-label>
            <ion-select>
                <ion-option *ngFor="let course of Courses" [value]="course">
                    {{course.choicetext}}
                </ion-option>
            </ion-select>
        </ion-item>
        <button class="button" type="submit" (click)="submitSearch()" ion-button full> Search </button>
        <div>{{message}}</div>
    </div>
</div>

这是我的scss文件：

page-search {
color: white;
.inner {
    margin: auto;
    width: 90%;
    height: 50%;
    padding-top: 35px;
    // padding-bottom: 0px;
}
.item-select {
    font-size: 15px;
    width: 100%;
    height: 25%;
    margin: 15px auto;
    border-radius: 5px;
}
.item-input {
    width: 100%;
    height: 25%;
    margin: 15px auto;
    border-radius: 5px;
}
.button {
    height: 30%;
    background: red;
    width: 30%;
    margin: auto;
    text-align: center;
    border-radius: 5px;
}
.alert-radio-label {
    white-space: normal!important;
}
.titleicon {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
    text-align: center;
}
.bottomitems {
    padding-bottom: 20px;
    padding-top: 20px;
    margin: auto;
}
.item-divider {
    background-color: #535A5E;
    color: white;
}

请给我一个解决方案。提前谢谢。

Ionic2，Angular2：当键盘弹出时，如何在设备上隐藏键盘下的内容？

0 个答案: