如何防止键盘在我的Ionic2 App中自动打开?

时间:2017-02-22 12:51:42

标签: ionic2

我正在使用Ionic2-Framework和Angular2开发移动应用程序 在我的应用的一部分中,我在幻灯片上有几个<ion-slides><ion-item><ion-input ...></ion-input></ion-item>

更改幻灯片时,键盘会打开而不会主动触摸其中一个输入字段。到目前为止,我只能在iOS上测试它,但我发现它只发生在type="tel" - 输入

有没有办法阻止应用这样做,因为我希望用户自己选择输入时间。

我的页面代码如下:
(为了便于阅读,我排除了一些部分)

<ion-header>
  <ion-navbar>
    <button ion-button icon-only menuToggle [hidden]="showBackButton">
      <ion-icon color="primary" name="menu"></ion-icon>
    </button>
    <button color="light" ion-button icon-only [hidden]="!showBackButton" (click)="goToPreviousSlide()">
      <ion-icon color="primary" name="arrow-back"></ion-icon>
    </button>
    <ion-title>Title</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>

  <ion-slides (ionSlideDidChange)="updateShowBackButton()">

    <!-- Some more slides... -->

    <ion-slide style="background-color: white" padding>
      <h2 class="slide-title">Hello {{person.name}}!</h2>
      <p>Now I need this and that information:/p>

      <ion-item>
        <ion-label>Day</ion-label>
        <ion-input type="tel" fixed [(ngModel)]="person.day"></ion-input>
      </ion-item>
      <ion-item>
        <ion-label>Month</ion-label>
        <ion-input type="tel" fixed [(ngModel)]="person.month"></ion-input>
      </ion-item>
      <ion-item>
        <ion-label>Year</ion-label>
        <ion-input type="tel" fixed [(ngModel)]="person.year"></ion-input>
      </ion-item>

      <ion-item-divider></ion-item-divider>

      <ion-item>
        <ion-label>Height (cm)</ion-label>
        <ion-input type="tel" fixed [(ngModel)]="person.height"></ion-input>
      </ion-item>
      <ion-item>
        <ion-label>Weight: (kg)</ion-label>
        <ion-input type="tel" fixed [(ngModel)]="person.weight"></ion-input>

      </ion-item>

      <button ion-button block (click)="goToNextSlide()">Next</button>

    </ion-slide>

    <!-- Some more slides... -->

  </ion-slides>

</ion-content>

如果您需要更多信息,请告诉我们!我很欣赏任何提示! :)

0 个答案:

没有答案