我'm using Angular2-rc5, and I'目前在我的登录页面上收到错误 . 即使我在init上创建它,我也找不到我的 formcontroll
. 知道我为什么会收到这个错误吗?
login component
import { Component, OnInit } from '@angular/core';
import { FormGroup, FormControl, FormBuilder, Validators } from '@angular/forms';
import { LoginService } from './login.service';
import { User } from '../../models/user';
@Component({
selector: 'login',
providers: [LoginService],
templateUrl: './login.component.html',
styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {
private loginForm: FormGroup; // our model driven form
private submitted: boolean; // keep track on whether form is submitted
private events: any[] = []; // use later to display form changes
constructor(private fb: FormBuilder, private ls:LoginService){
}
ngOnInit(){
this.loginForm = new FormGroup({
email: new FormControl('',[<any>Validators.required]),
password: new FormControl('', [<any>Validators.required, <any>Validators.minLength(6)]),
rememberMe: new FormControl()
});
}
save(model: User, isValid: boolean) {
console.log("Test");
console.log(model, isValid);
}
// Login in user
login(email: any, password: any){
this.ls.login(email, password, false);
}
}
Page.html
<div id="login-page">
<div class="form-wrapper">
<form class="login-form" [formGroup]="loginForm" novalidate (ngSubmit)="save(loginForm.value, loginForm.valid)">
<div >
<div class="input-field col s12 center">
<p class="center login-form-text">Login page</p>
</div>
</div>
<div >
<div class="input-field col s12">
<input id="email" type="email">
<label class="center-align" for="email" formControlName="email">Email</label>
</div>
</div>
<div >
<div class="input-field col s12">
<input id="password" type="password">
<label class="center" for="password" formControlName="password">Password</label>
</div>
</div>
<div >
<div class="input-field col s12 m12 l12 login-text">
<input id="remember-me" type="checkbox" formControlName="rememberMe">
<label for="remember-me">Remember me</label>
</div>
</div>
<div >
<div class="input-field col s12">
<ahref="index.html">Login</a>
</div>
</div>
<div >
<div >
<p><a href="page-register.html">Register Now!</a></p>
</div>
<div >
<p><a href="page-forgot-password.html">Forgot password ?</a></p>
</div>
</div>
</form>
</div>
</div>
Exception
EXCEPTION:未捕获(在承诺中):错误:./LoginComponent类中的错误LoginComponent - 内联模板:13:45由以下原因引起:没有表单控件的值访问器,名称为:'email'.....
3 回答
您正在将
formControlName
添加到标签而不是输入 .你有这个:
试试这个:
同时更新其他输入字段 .
For UnitTest angular 2 with angular material 您必须在导入部分添加MatSelectModule模块 .
在我的例子中,我使用了像
div
这样的contenteditable
元素的Angular表单,并且之前遇到过类似的问题 .我写了ng-contenteditable模块来解决这个问题 .