Angular 根据条件动态添加验证

• html

<label
    nz-checkbox
    [(ngModel)]="test"
    (ngModelChange)="handleValueChange($event)">
    测试选中后添加验证
</label>
<form nz-form [formGroup]="validateForm">
  <nz-form-item *ngIf="item.value === objectiveProcessTypeEnum.GLOBAL">
    <nz-form-label nzNoColon="true" [nzSpan]="4">
      {{测试必须要选择}}
    </nz-form-label>
    <nz-form-control [nzSpan]="7">
      <nz-select
        formControlName="testMustChoose"
        [(ngModel)]="testMustChooseModel">
        <nz-option nzLabel="Test1" nzValue="test1"></nz-option>
        <nz-option nzLabel="Test2" nzValue="test2"></nz-option>
        <nz-option nzLabel="Test3" nzValue="test3"></nz-option>
      </nz-select>
    </nz-form-control>
  </nz-form-item>
</form>

• ts

validateForm: FormGroup;
test = false;
testMustChooseModel: string;

constructor(private formBuilder: FormBuilder) {
 this.validateForm = this.formBuilder.group({
 	testMustChoose: [this.testMustChooseModel, []]
})

ngOnInit() {
	this.updateValidator(this.test);
}

updateValidator(value: boolean) {
	let control: FormControl = this.validateForm.get('testMustChoose');
	if (value) {
		control.setValidators(Validators.required);
	} else {
		control.clearValidators();
	    control.updateValueAndValidity({onlySelf: true});
	}
}

handleValueChange(newValue: boolean) {
	this.updateValidator(newValue);
}