How to control setValidators in angular?

Question

I using relative forms at angular 4, I’m having trouble controlling setValidators in somewhat large structure, like below:

this.criteria = this.formBuilder.group({
      discount: this.formBuilder.group({
        percentage: [null],
        amount: [null],
      }),
    });

That’s the way I’m doing it to control it. However, when there are more than two "nos" the control does not work, giving the following error: Property 'control' does not exist on type 'Abstractcontrol'. ts(2339)

this.criteria.controls['discount.percentage'].setValidators([Validators.required]);

Answer 1

all right?

For face control you must use the method .get(). For example:

this.criteria.get('discount').get('percentage').setValidators([Validators.required]);

Another way to solve your problem would be to specify the Validators in your form definition.

this.criteria = this.formBuilder.group({
    discount: this.formBuilder.group({
    percentage: [null, Validators.required],
    amount: [null],
  })
});

Answer 2

do not use Controls. use like this:

this.criteria.get('discount').get('percentage').setValidators([Validators.required]);