title: Angular : Conditionally changing FormControl
body: <p>I am creating a formGroup Validation based on a toggle value</p>
  
  <pre><code>public toggle:boolean=false;
  
  
  ngOnInit(): void {
            this.formGroup = this.formBuilder.group({
            formArray: this.formBuilder.array([
              this.formBuilder.group({
                toggleFormCtrl: [this.toggle, null],
                fnameFormCtrl: ['', this.checkInputs.bind(this)],
                lnameFormCtrl: ['', this.checkInputs.bind(this)],
                addressFormCtrl: ['', this.checkMiInput.bind(this)]
              }),
           ])
         });
  
    }
  
  checkInputs(c: FormControl) {
  if (this.toggle) {
    return c.value === '' ? null : {
      checkinputs: {
        valid: false
      }
    };
  } else {
    return c.value ? null : {
      checkinputs: {
        valid: false
      }
    };
  }
  
  }
  
  
  
  checkMiInput(c: FormControl) {
      if (this.toggle) {
        return c.value ? null : {
          checkMiInput: {
            valid: false
          }
        };
      } else {
        return c.value === '' ? null : {
          checkMiInput: {
            valid: false
          }
        };
      }
    }
  </code></pre>
  
  <p>Based on the toggle value I want to validate the form. When toggle value is <code>true</code>, the form should validate formControl <code>addressFormCtrl</code> and when the toggle is false, it should validate <code>fnameFormCtrl</code> and <code>lnameFormCtrl</code>
  My code isn't working well. What am I missing? </p>