在模板驱动的表单中测试表单验证-Angular 4/6

时间:2018-08-31 06:18:51

标签: angular angular-test angular-template-form

我有一个简单模板驱动的表单,其中输入字段是自定义子组件。我必须为此编写单元测试用例。

模板

<form #RegionForm="ngForm" id="RegionForm">
    <div class="row">
        <app-input-text [(sharedVar)]="regionDetails.regionName" [label]="'Region Name'" [fieldId]="'regionName'" [isMandatory]="true" ></app-input-text>
        <app-input-text [(sharedVar)]="regionDetails.description" [label]="'Description'" [fieldId]="'description'" [isMandatory]="false"></app-input-text>
        <button [disabled]="!RegionForm.valid" class="btn btn-default saveBtn" (click)="onRegionSubmit();btnLoader=true" [style.pointer-events]="btnLoader?'none':''">
              &nbsp; {{submitButtonText}} &nbsp;
              <i class="fa fa-spinner fa-spin " *ngIf="btnLoader"> </i>
        </button>

    </div>
</form>

子组件模板

<input type="text" class="form-control" [id]="fieldId" [name]="fieldId" [placeholder]="label" [(ngModel)]="sharedVar" (ngModelChange)="change($event)"
  [required]="isMandatory" [pattern]="pattern" #childRef="ngModel" ChildFieldValidation [disabled]="isDisabled">

我想在父组件中编写一个测试用例以进行表单验证

请帮助为模板驱动的表单

编写它

0 个答案:

没有答案