angular2의 데이터 테이블 내부에서 폼 유효성 검사를 적용하는 방법

Question

데이터 테이블 템플릿 안에있는 텍스트 상자에 대해 필수 필드 유효성 검사를 적용하려고합니다.

필수 필드 유효성 검사 메시지가 제대로 표시되지만 양식 태그가 없으므로 구성 요소에서 form.valid를 확인할 수 없습니다.

코드를 검색 :

<data-table id="user-grid"(reload)="reloadItems($event) [items]="userData"> 

    <data-table-column [header]="'UserName'"> 
      <template #dataTableCell let-item="item"> 
       <span> 
       <input type="text" [(ngModel)]="item.UserName" class="form-control" required #UserName="ngModel" name="UserName"/> 

       <span class="text-danger" *ngIf="(UserName.errors != null && UserName.errors.required && (UserName.dirty))"> 
        Please enter user name. 
       </span> 
       </span>     
      </template> 
    </data-table-column> 
    <data-table-column [header]="'Action'" > 
     <template #dataTableCell let-item="item">          
      <a title="Save" (click)="save(item)" class="btn green btn-sm">           
      </a>           
     </template> 
    </data-table-column> 

    </data-table> 

어떤 도움을 감지 할 수있을 것입니다.

Answer 1

ngForm을 갖는 form 태그 안에 datatable 요소를 넣으십시오. 양식 검증을 해고합니다. 아래 참조 :

<form #testform="ngForm"> 
    <data-table> 
    </data-table> 
</form>