角度2中的表单验证

我正在写angular2中的表单验证。我的错误是Cannot read property 'valid' of undefined角度2中的表单验证

我的HTML文件包含一个形式，即

<form id="commentform" class="comment-form" novalidate 
     [ngFormModel] = "contact" (ngSubmit)="submit(contact.value)"> 
      <div class="form-input"> 
      <input type="text" id="author" name="author" placeholder="Name *" value="" 
      [ngFormControl] = "contact.controls['author']" pattern="[a-zA-Z ]*"/> 
     <div [hidden]="author.valid">Name is required 
     </div> 
      </div>

我得到错误的div [hidden]="author.valid"。错误是Cannot read property 'valid' of undefined"

我的组件文件包含

import {FormBuilder ,ControlGroup,Validators } from '@angular/common'; 
@Component({ 
    selector: 'my-contact', 
    templateUrl : 'app/contact.html' 
    } 
export class ContactComponent { 
    contact : ControlGroup; 
    constructor(private _OnChange:OnChange,private _formBuilder : FormBuilder){ 
    this.ngAfterViewInit(); 
    } 

    ngOnInit() : any{ 
     this.contact = this._formBuilder.group({ 
     'author' : ['',Validators.required] }); } 
submit(){ 
    console.log(JSON.stringify(this.contact.value)); 
    }

来源

2016-07-25 virushree

使用

[hidden]="contact.controls['author'].valid"

来源

2016-07-25 06:23:42

为什么？哪里有什么区别？任何参考？ – dakab

您需要在''中添加'＃author ='ngForm''来使'[hidden] =“author.valid”工作，导致类似“检查后表达式被改变”的错误。或者，您可以创建一个变量'author = new Control（'，[Validators.required]）;'并将其添加到'this._formBuilder.group（{'author'：this.author}）''，然后您的视图绑定也应该起作用。我也建议你迁移到新的表单模块。没有意义投入时间学习已经被取代的东西。 –

因为作者是不是一个变量。使用

<div [hidden]="contact?.controls?.author?.valid">Name is required</div>

其实，甚至更好。你应该使用新的表格模块@ angular/forms https://scotch.io/tutorials/using-angular-2s-model-driven-forms-with-formgroup-and-formcontrol

来源

2016-07-25 06:29:39 Chybie

角度2中的表单验证

回答

相关问题