ionic-framework/e2e/text-input/form-inputs/main.html

<ion-toolbar><ion-title>Inline Label Text Input</ion-title></ion-toolbar>


<ion-content>

  <form (ng-submit)="submit($event)" [ng-form-model]="loginForm" #mf="ngForm" novalidate>

    <ion-list>
      <ion-input>
        <ion-label>Email:</ion-label>
        <input [(ng-model)]="login.email" ng-control="email" type="email" placeholder="Required" required>
        <button clear item-right>
          <icon mail></icon>
        </button>
      </ion-input>

      <ion-input>
        <ion-label>Username:</ion-label>
        <input [(ng-model)]="login.username" ng-control="username" type="text" placeholder="Optional">
        <button clear item-right>
          <icon person></icon>
        </button>
      </ion-input>

      <ion-input>
        <ion-label>Password:</ion-label>
        <input [(ng-model)]="login.password" ng-control="password" type="password" placeholder="Required" required>
        <button clear item-right>
          <icon lock></icon>
        </button>
      </ion-input>

      <ion-input>
        <ion-label>Comments:</ion-label>
        <textarea [(ng-model)]="login.comments" ng-control="comments" placeholder="Required" required>Comment value</textarea>
      </ion-input>

      <ion-item [hidden]="submitted == false || mf.form.valid">
        <p danger>Form is Invalid</p>
      </ion-item>
    </ion-list>

    <div padding>
      <button block type="submit">Login</button>
    </div>

    <div [hidden]="submitted == false" padding-left>
      <b>Valid form?:</b> {{ mf.form.valid }}<br>
      <b>Submitted form?:</b> {{ submitted }}<br>
      <b>Email:</b> {{ login.email }}<br>
      <b>Username:</b> {{ login.username }}<br>
      <b>Password:</b> {{ login.password }}<br>
      <b>Comments:</b> {{ login.comments }}
    </div>

  </form>

</ion-content>