ionic-framework - Ionic3 输入不可选

标签 ionic-framework input ionic3

ionic 角度 3.9.2

我有一个像下面这样的登录页面,它在用户未登录时在启动时加载。 问题是,在完成以下任一操作之前,用户名/电子邮件和密码字段都无法选择: - 打开侧面菜单,然后关闭它 - 导航到另一个选项卡,导航回登录 - 长时间(最多 30 秒)频繁点击输入框

<ion-header title="login">
    <ion-navbar>
        <button ion-button menuToggle>
            <ion-icon name="menu"></ion-icon>
        </button>
        <ion-title>{{"loginPage.title"|translate}}</ion-title>
        <ion-buttons end>
        </ion-buttons>
    </ion-navbar>
</ion-header>
<ion-content padding>
    <form #loginForm="ngForm" novalidate>
        <ion-list no-lines>
            <ion-item>
                <ion-label floating color="primary">{{"loginPage.username"|translate}}</ion-label>
                <ion-input [(ngModel)]="login.username" name="username" type="email" #username="ngModel" spellcheck="false" autocapitalize="off"
                 required>
                </ion-input>
            </ion-item>
            <p ion-text [hidden]="username.valid || submitted == false" color="danger" padding-left>{{"loginPage.usernameRequired"|translate}}
            </p>

            <ion-item>
                <ion-label floating color="primary">{{"loginPage.password"|translate}}</ion-label>
                <ion-input [(ngModel)]="login.password" name="password" type="password" #password="ngModel" required>
                </ion-input>
            </ion-item>
            <p ion-text [hidden]="password.valid || submitted == false" color="danger" padding-left>
                {{"loginPage.passRequired"|translate}}
            </p>
        </ion-list>
        <button ion-button (click)="onLogin(loginForm)" type="submit" block>{{ "loginPage.login" | translate }}</button>
    </form>
    <div></div>
    <div padding>
        <a class="item" href="#" (click)="onSignup()">{{ "loginPage.signup" | translate }}</a>
    </div>
    <div padding>
        <a class="item" href="#" (click)="onForgotPassword()">{{ "loginPage.forgotPassword" | translate }}</a>
    </div>
    <div padding>
        <a class="item" href="#" (click)="onVerify()">{{ "loginPage.verification" | translate }}</a>
    </div>
</ion-content>

关于如何解决这个问题的任何线索?因为我现在正在通过谷歌和 ionic 论坛查看超过 1 小时,但找不到任何解决问题的方法......

编辑:

我发现了一个小技巧,可以通过从元素中删除类 input-cover 来实现。但这感觉很脏......

let elements = document.querySelectorAll('.input-cover');
for(let i in elements)
{
  if(elements[i].classList)
  elements[i].classList.remove('input-cover');
}

最佳答案

在您的 app.module.ts 上将此代码放入 imports 标签中:

IonicModule.forRoot(MyApp, {
        platforms: {
            android: {
                activator: 'none'
            }
        },
        scrollAssist: false, autoFocusAssist: false
    })

关于ionic-framework - Ionic3 输入不可选,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56309902/

相关文章:

react-native - React Native、Ionic、Flutter 和 NativeScript 中的代码可重用性(一次编写,随处使用)

java - 如何询问用户文件名,然后扫描文件夹中的特定类型,如果为 true,则打开文件名,如果不是,则抛出错误

c++ - 我在输入功能上做错了什么?

javascript - ionic 2 : Runtime Error Uncaught (in promise): TypeError: Cannot read property 'nav' of undefined

javascript - Angular 'FileConstructor is not a constructor'

javascript - 在谷歌地图上添加多个标记

javascript - 如何动态改变 ion-content 位置?是否可以?

javascript - 如何更改输入类型 ="date"日期选择器的外观?

ionic-framework - 如何将 ionic 头像放置在 ionic 项目的左上角?

android - Geolocation Ionic 3 总是返回 "{}"