Question

在我的离子2应用程序的登录页面中，我有以下内容：

<form [formGroup]="signinForm" (submit)="onSubmit($event)" style="padding-top: 20px;">
    <div class="formItem">
            <ion-input #username type="text" placeholder="Username" formControlName="username" autocapitalize="off"></ion-input>
    </div>
</form>

这会产生一个奇怪的1-pixel-wide artifact。

以下是它在页面上产生的内容：

<div class="formItem">
    <ion-input formcontrolname="agencyNumber" placeholder="Agency ID" type="text" class="input input-md ng-untouched ng-pristine ng-valid" ng-reflect-name="agencyNumber" ng-reflect-placeholder="Agency ID" ng-reflect-type="text">
        <input class="text-input ng-untouched ng-pristine ng-valid text-input-md" formcontrolname="agencyNumber" placeholder="Agency ID" autocomplete="off" autocorrect="off" ng-reflect-klass="text-input" ng-reflect-ng-class="text-input-md" ng-reflect-model="test9994" ng-reflect-type="text" type="text" ng-reflect-placeholder="Agency ID">
        <!--template bindings={
        "ng-reflect-ng-if": "true"
        }-->
        <input aria-hidden="true" next-input="" ng-reflect-type="text" type="text">
        <button class="text-input-clear-icon disable-hover button button-md button-clear button-clear-md" clear="" ion-button="" type="button" ng-reflect-hidden="true" hidden="">
            <span class="button-inner"></span>
            <div class="button-effect"></div>
        </button><!--template bindings={
        "ng-reflect-ng-if": "true"
        }-->
        <div class="input-cover" tappable=""></div>
   </ion-input>
</div>

这个奇怪的小工件似乎是第二个输入字段：

<input aria-hidden="true" next-input="" ng-reflect-type="text" type="text">

这是什么？为什么会出现？

编辑：我已使用最新支持的依赖项更新到离子2.0.0，问题仍然存在。

Answer 1

我相信来自FormBuilder的验证器。如果你填写它并且碰巧无效，它应该变成红色并在字段下划线。您应该能够通过编辑ng-valid和ng-invalid类并制作

来删除它

为什么离子输入显示第二个1像素宽的文本字段？

1 个答案: