表单组验证不适用于动态复选框

时间:2019-10-10 13:14:51

标签: angular angular7

如何检查验证动态复选框是否已选中。表单组验证无效。

html =>

<div class="col-md-6">
    <div class="form-group">
        <label for="date2">Keywords</label>
        <ul class="keywords-ul">
            <li *ngFor="let keyword of keyWordsArr">
                <input type="checkbox" id="{{keyword}}" required (change)="getFinalKeywords($event.target.value)" value="{{keyword}}" formControlName="keywords" class="form-control" [required] [ngClass]="{ 'is-invalid': submitted && f.keywords.errors }">
                <label for="{{keyword}}">{{keyword}}</label>
            </li>
            <div *ngIf="myForm.get('keywords').errors  && submitted">
                <div *ngIf="myForm.get('keywords').hasError('required')">
                    <span style="color: red;">Please select keywords
                                                            Name.</span>
                </div>
            </div>
        </ul>
    </div>
</div>

t.s file =>

this.myForm = this._formBuilder.group({
      //from validation of contact details...
      company_name: new FormControl('', [  
        Validators.required,  
        Validators.minLength(3),  
        Validators.maxLength(30),  
        Validators.pattern('^[a-zA-Z ]*$')]), 
      emailId:new FormControl('', [  
        Validators.required,  
        Validators.minLength(20),  
        Validators.maxLength(30),  
        Validators.pattern("^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+.[a-zA-Z0-9-.]+$")  
      ]),  
      owner_name:new FormControl('', [  
        Validators.required,  
        Validators.minLength(3),  
        Validators.maxLength(30),  
        Validators.pattern('^[a-zA-Z ]*$')]), 
      mobNo: new FormControl('', [  
        Validators.required,  
        Validators.minLength(10),  
        Validators.maxLength(12),  
        Validators.pattern('^[0-9]*$')]), 
      state: new FormControl('', []), 
      city:new FormControl('', []),
      category:new FormControl('', []),
      sub_category: new FormControl('', []),
      sub_sub_category: new FormControl('', []),
      keywords: new FormControl('', []),
    });

0 个答案:

没有答案