Wie Formularvalidierung in Datentabelle in angular2 anwenden

Question

Ich versuche, erforderliche Feldüberprüfung für Text-Box, die in Datentabelle Vorlage ist anzuwenden.

Die erforderliche Feldüberprüfungsmeldung wird richtig angezeigt, aber da es kein Formular-Tag gibt, konnte ich form.valid in der Komponente nicht überprüfen.

Bitte Code unten finden:

<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> 

Jede Hilfe wird spürbar sein.

Answer 1

Setzen Sie das Datatable-Element in das Formular-Tag mit ngForm. Es würde die Formularvalidierungen auslösen. Bitte siehe unten:

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