在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML5  網(wǎng)絡(luò)安全/ angular2 組件庫NG-ZORRO如何對(duì)復(fù)選框做必填校驗(yàn)

angular2 組件庫NG-ZORRO如何對(duì)復(fù)選框做必填校驗(yàn)

當(dāng)如下寫法時(shí),指定為必選,有辦法校驗(yàn)么?當(dāng)沒選擇時(shí)提示信息

html:

     <div nz-form-item nz-row>
        <div nz-form-label nz-col [nzSpan]="4">
          <label for="one" nz-form-item-required>復(fù)選測(cè)試</label>
        </div>
         <div nz-form-control nz-col [nzSpan]="10" >
          <nz-checkbox-group formControlName="one"  [(ngModel)]="oneOption" ></nz-checkbox-group>
          <div nz-form-explain *ngIf="getFormControl('one').dirty&&getFormControl('one').hasError('required')">通知范圍必選</div>
        </div>
      </div>

ts:

validateForm: FormGroup;
oneOption: any;
constructor(
    private fb: FormBuilder,
 ){}
ngOnInit() {
    this.oneOption = [
    { label: 'Apple', value: 'Apple', checked: true },
    { label: 'Pear', value: 'Pear', checked: false },
    { label: 'Orange', value: 'Orange', checked: false },
    ]
    this.validateForm = this.fb.group({
         one: [null, [Validators.required]],
    })
}
  getFormControl(name) {
    return this.validateForm.controls[name];
  }

現(xiàn)在提交時(shí)打印發(fā)現(xiàn)this.validateForm.value.scopes包含oneOption完整信息,getFormControl('one').dirty為true,但getFormControl('one').hasError('required')一直為false

回答
編輯回答
局外人

建議[(ngModel)] 與formControlName 不要同時(shí)使用,

[(ngModel)]="oneOption"
    this.oneOption = [
    { label: 'Apple', value: 'Apple', checked: true },
    { label: 'Pear', value: 'Pear', checked: false },
    { label: 'Orange', value: 'Orange', checked: false },
    ]

這邊明顯有問題,

[(ngModel)]代表的是選中的值,而不是選項(xiàng)

2018年5月2日 22:04
編輯回答
誮惜顏

找到方法了,自己手動(dòng)自定義了一下對(duì)one的檢測(cè)

2017年1月3日 11:50