角度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中的表單驗證

回答

相關問題