Question

我的离子3应用程序中有一个非常奇怪的问题。我正在为应用添加功能，该功能涉及使用Angular 2+表单和验证器的多步输入过程。在网络，Android和较旧的iOS设备（iOS 9）上一切都很好。在iOS 10上，我在提交第一个表单步骤后得到以下信息：

Resetting plugins due to page load

然后应用程序重新启动。主要触发点似乎是在第一步之后设置了一个布尔值，它隐藏了第一个表格并显示了第二个表格。注释掉一行可以防止这个问题。

我能做些什么来找到有关为什么仅在iOS 10中抛出此错误的更多信息？例如，额外的日志记录？

HTML

<ion-card>
    <ion-card-header>
        <ion-icon name="person-add"></ion-icon> Sign Up!
    </ion-card-header>

    <!--Step 1 - confirm user-->
    <ion-list no-lines *ngIf="!hasConfirmedStep1">
      <form [formGroup]="formStepOne">

       <...SNIP...>

        <ion-item>
          <button ion-button icon-right float-right small (click)="checkUser()" [disabled]="!formStepOne.valid">
            Next
            <ion-icon name="arrow-round-forward"></ion-icon>      
          </button>
        </ion-item>
      </form>
    </ion-list>

    <!--Step 2...Create Account-->
    <ion-list no-lines *ngIf="hasConfirmedStep1 && !hasConfirmedStep2">
      <form [formGroup]="formStepTwo">


        <!--Email/Confirm email-->
        <div formGroupName="validEmail">

        <...SNIP...>

        </div>
        <ion-item>
          <button ion-button icon-right float-right small (click)="createUser()" [disabled]="!formStepTwo.valid">
            Next
            <ion-icon name="arrow-round-forward"></ion-icon>      
          </button>
        </ion-item>
      </form>

    </ion-list>
</ion-card>

TS

async checkUser() {

    this.hasSubmittedStep1 = true;
    this.errorMessage = this.successMessage = "";

    if (!this.formStepOne.valid) {
      this.loggingService.debug("Invalid signup form for Check User");
      this.errorMessage = "Please enter valid input.";
    }
    else {
      this.loggingService.debug("Valid signup form for Check User.  Checking info...");

      //Confirm User


      this.successMessage = 'Confirmed!  Please Create Account.';
      this.hasConfirmedStep1 = true;
    }
  }

Answer 1

我不确定原因，但在iOS 10上，问题似乎隐藏了HTML [formGroup]标签。此页面构造函数使用formBuilder.group()来实例化这些表单的对象。 iOS 10上的某些内容可能会出现与这些相关的HTML表单吗？

我的修复是简单地重新构建页面，以便始终显示<form>标记，但在其中我有一个<div>，我将*ngIf置于显示/隐藏内部视觉元素。奇怪，但似乎有效。

Ionic 2+，iOS仅发布：由于页面加载而重置插件

1 个答案: