Hello,
I’m facing issue while creating a simple form
for login into my app. I’m referring ionic2 conference app
source code for creating login form
.
But at the time of ionic serve
in browser console
I got following error:
No value accessor for ‘username’
This is my login.html
file
<form #loginForm="ngForm" novalidate>
<ion-item>
<ion-label floating>Username</ion-label>
<ion-input [(ngModel)]="login.username" ngControl="username" type="text" name="username" #username="ngForm" spellcheck="false" autocapitalize="off" required></ion-input>
</ion-item>
<p [hidden]="username.valid || submitted == false" danger padding-left>
Username is required.
</p>
<ion-item>
<ion-label floating>Password</ion-label>
<ion-input [(ngModel)]="login.password" ngControl="password" type="password" name="password" #password="ngForm" required></ion-input>
</ion-item>
<p [hidden]="password.valid || submitted == false" danger padding-left>
Password is required
</p>
<div padding></div>
<div padding></div>
<button primary block (click)="onLogin(loginForm)" type="submit">Sign In</button>
</form>
and in login.ts
file
@Component({ templateUrl: 'build/pages/login/login.html' } export class LoginPage {
login: {username?: string, password?: string} = {}
submitted = false;
constructor(private nav: NavController) {}
onLogin(form) {
this.submitted = true;
if (form.valid) {
console.log(form);
console.log('Login data : ' + JSON.stringify(form));
}
}
}
All is same as ionic2 conference app
. but it’s showing error.
Plz let me know where I’m doing wrong.