_co.userData is undefined ionic 3 - angularjs

Question

I am getting Error for the ngModel.
_co.userData is not defined.
I have posted my home.ts and home.html file.
browser console showing the error is near [(ngModel)].
This is my home.ts file
import { Component, NgModule } from '#angular/core';
import { NavController } from 'ionic-angular';
import { AuthService} from '../../providers/auth-service/auth-service';
import { CompanygroupsPage } from '../companygroups/companygroups';
#Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
responseData:any;
userData:{"username":"hi","password":"123"}
constructor(public navCtrl: NavController, public authService:AuthService){}
login(){
console.log(this.userData);
this.navCtrl.push(CompanygroupsPage);
}
}
This is my home.html file
<ion-content padding class="home">
<ion-list class="login">
<form>
<ion-item class="inputs">
<ion-label stacked>Username</ion-label>
<ion-input value="" type="text" [(ngModel)]="userData.username" name="username"></ion-input>
<ion-icon name="contact" item-left></ion-icon>
</ion-item>
<ion-item class="inputs">
<ion-label stacked>Password</ion-label>
<ion-input type="password" value="" [(ngModel)]="userData.password" name="password"></ion-input>
<ion-icon name="lock" item-left></ion-icon>
</ion-item>
<button (click)="login()" class="btn_login" ion-button color="light" round>Login</button>
</form>
</ion-list>
<ion-footer class="footer">
<ion-toolbar>
...
</ion-toolbar>
</ion-footer>
Error is near
<ion-input value="admin" type="text" [(ngModel)]="username" name="username"></ion-input>

Answer 1

You need to assign,
Change
From
userData:{"username":"hi","password":"123"}
To
userData = {"username":"hi","password":"123"}