我目前正在尝试完成角度基础知识指南,而我目前在反应形式方面存在一些问题。
HTML的第4行抛出了此错误: ERROR TypeError: Cannot read property 'value' of undefined
component.html:
<form [formGroup]="loginForm">
<label>
Username:
<input type="text" formControlName="name">
</label>
<p>{{name.value}}</p>
<label>
adress:
<input type="text" formControlName="adress">
</label>
</form>
component.ts:
import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms';
@Component({
selector: 'app-login',
templateUrl: './login.component.html',
styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {
constructor(
private formbuilder : FormBuilder
) { }
loginForm :FormGroup;
username : FormControl;
adress : FormControl;
ngOnInit() {
this.username = new FormControl('test',Validators.required);
this.adress = new FormControl('something',Validators.required);
this.loginForm = this.formbuilder.group({
name : this.username,
adress : this.adress
})
}
}
我已经尝试过使用formbuilder的各种变体,但是我尚未能够使它起作用。
数据显示在HTML文件中的输入控件中,因此我认为html可能已在脚本之前完成加载,或者反之,这会导致一些未定义的错误。但这不是事实,因为当我尝试在输入区域中编辑文本时也会引发错误。
老实说,我不知道为什么会发生这种情况,而且我已经经历了很多搜索工作,在那儿我找到了遇到类似问题的人,我已经尝试过解决方案,但它似乎对我没有用。
所以请帮助,在此先感谢。
编辑:因此,问题并不像控制台所说的那样在第4行出现,而是在第6行,我试图访问控件的值。
嗨,@ jAnderson,您使用错误的方式来获取formControl的值。您必须在值之前添加formGroup名称。像这样的东西
<p>{{loginForm.value.name}}</p>
这一定会对您有帮助。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句