2 각도 : 데이터를 제출 한 후 검증 화재

Question

난 내 HTML 코드에서 폼 태그를 사용하고 있지 않다

입니다 데이터가 성공적으로 명확하고

을 경로도 주입하지만, 유효성 검사가 내가 제출 한 후에 불이며, 새

<div class="col-lg-6 col-md-8"> 
    <input type="text" [disabled]="!isEditable" class="form-control" id="field-1" name="field1" pattern = "^[0-9]*$" placeholder="" maxlength="30" required [(ngModel)]="country.countryCode" #field1 = ngModel> 
     <div class="alert alert-danger" [hidden]=" (field1.valid || field1.pristine)"> 
      <ul> 
       <li> In vlaid name </li> 
       <li [hidden]="errorData.errorDetails?.countryCode==null">{{errorData.errorDetails?.countryCode}}</li> 
    </ul> 
     </div> 
</div> 

---

if (this.country.id == 0 || this.country.id == undefined) { // add 
     this.dataService.add("country/save", this.country).then((status: any) => { 
      if (status.success == false) { 

      } else if (saveAction == 'saveNew') {     
       this.country = {}; 
      } else if (saveAction == 'saveBack') { 

       this.router.navigate(['/comm/country']); 
      } 
     }); 

Answer 1

<section *ngIf="active"> 
<div class="col-lg-6 col-md-8"> 
<input type="text" [disabled]="!isEditable" class="form-control" id="field-1" name="field1" pattern = "^[0-9]*$" placeholder="" maxlength="30" required [(ngModel)]="country.countryCode" #field1 = ngModel> 
    <div class="alert alert-danger" [hidden]=" (field1.valid || field1.pristine)"> 
     <ul> 
      <li> In vlaid name </li> 
      <li [hidden]="errorData.errorDetails?.countryCode==null">{{errorData.errorDetails?.countryCode}}</li> 
</ul> 
    </div> 
</div> 

this.active = false; 
       setTimeout(() => this.active = true, 0);