Come creare un modulo in ionico 2

Question

Voglio provare ionico/angolare 2 e non riesco a capire come creare un modulo. Come posso fare questo?

Answer 1

Per iniziare, assumiamo un semplice caso di creazione di un modulo di accesso.

• forma:

  • (ingresso) nome utente

  • (ingresso) la password

  • (pulsante) login

Il file .html:

 <form [ngFormModel]="loginForm" (submit)="login($event)"> 
      <ion-input stacked-label> 
       <ion-label>Username</ion-label> 
       <input type="text" ngControl="username"> 
      </ion-input> 

      <ion-input stacked-label> 
       <ion-label>Password</ion-label> 
       <input type="password" ngControl="password"> 
      </ion-input> 

      <div padding> 
       <button block type="submit" [disabled]="!loginForm.valid">Login</button> 
      </div> 
     </form> 

Nel file .js:

import {FormBuilder, Validators} from 'angular2/common'; 

export class LoginPage { 

    constructor(form: FormBuilder) { 
    // Create a new form group 
    this.loginForm = form.group({ // name should match [ngFormModel] in your html 
     username: ["", Validators.required], // Setting fields as required 
     password: ["", Validators.required] 
    } 

    // This is called on form submit 
    login(event) { 
    console.log(this.loginForm.value) // {username: <usename>, password: <password> } 
    event.preventDefault(); 
    } 

} 

Reference