Ionic 2 beta 11 new Forms api problem

I’ve tried using new forms api which compatible with Angular 2 rc4. (refering )

But, when I started app, I get an error saying:
TypeError: self.context.username is undefined

Here is login.html

   <form #registerForm="ngForm"  >
             <ion-label floating >Username</ion-label>
             <ion-input name="username" [(ngModel)]="login.username" type="text"  spellcheck="false" autocapitalize="off" required>
           <p [hidden]="username.valid || submitted == false" danger padding-left>
             Username is required

         <ion-label floating >Password</ion-label>
         <ion-input name="password" [(ngModel)]="login.password"  type="password" required>
       <p [hidden]="password.valid || submitted == false" danger padding-left>
         Password is required
<ion-row responsive-sm>
          <button (click)="loginCheck(registerForm)" type="submit" primary  class="button button-positive">Login</button>


Here is the login.ts

import {Component} from '@angular/core';
import { Validators,   Validator} from '@angular/common';
import {REACTIVE_FORM_DIRECTIVES, FormControl, FormGroup} from '@angular/forms';
import { NavController,Tabs,MenuController } from 'ionic-angular';
 import { Observable } from 'rxjs/Rx';


     directives: [REACTIVE_FORM_DIRECTIVES],

    templateUrl: 'build/pages/login/login.html'
export class LoginPage {
  submitted = false;
  login :{username?: string , password?: string}={ };

 constructor(private navCtrl: NavController,menu:MenuController) {

loginCheck(registerForm: FormGroup) {
        this.submitted = true;
        if (registerForm.valid) {


İf I use login.username.valid instead of username.valid in hidden p element, the error is not occured. It seems the name=“username” directive is not considered.

1 Like