title: Angular creating custom reactive form validator
body: <p>I created simple ValidatorFn function:</p>
  <pre><code>  requiredArrayLength(length: number): ValidatorFn {
      return (control: AbstractControl): ValidationErrors | null =&gt; {
        if (length &gt;= 1) {
          return null;
        }
        else
          return { 'requiredArrayLength': true };
      }
    }
  </code></pre>
  <p>and i'm trying use this by my formControl:</p>
  <pre><code>  createClientForm = new FormGroup({
      redirectUris: new FormControl(null, [this.requiredArrayLength(this.redirectUris.length)]),
      allowedScopes: new FormControl(null, [this.requiredArrayLength(this.allowedScopes.length)]),
      postLogoutUris: new FormControl(null, [this.requiredArrayLength(this.postLogoutUris.length)])
    });
  </code></pre>
  <p>These arrays aren't empty, because their values are successfully displayed in my mat-chip-list:</p>
  <pre><code>&lt;mat-form-field appearance=&quot;fill&quot; color=&quot;accent&quot; class=&quot;field&quot;&gt;
                  &lt;mat-label&gt;Redirect URIs&lt;/mat-label&gt;
                  &lt;mat-chip-list #redirectUrisList formControlName=&quot;redirectUris&quot;&gt;
                      &lt;mat-chip class=&quot;chip&quot; *ngFor=&quot;let redirectUri of redirectUris&quot;
                          (removed)=&quot;remove(redirectUri, 'redirectUri')&quot;&gt;
                          {{redirectUri}}
                          &lt;button matChipRemove&gt;
                              &lt;mat-icon&gt;cancel&lt;/mat-icon&gt;
                          &lt;/button&gt;
                      &lt;/mat-chip&gt;
                      &lt;input placeholder=&quot;New redirect uri...&quot; [matChipInputFor]=&quot;redirectUrisList&quot;
                          [matChipInputSeparatorKeyCodes]=&quot;separatorKeysCodes&quot; [matChipInputAddOnBlur]=&quot;true&quot;
                          (matChipInputTokenEnd)=&quot;add($event, 'redirectUri')&quot;&gt;
                  &lt;/mat-chip-list&gt;
              &lt;/mat-form-field&gt;
  </code></pre>
  <p>The problem is that my formControl is always wrong, but when I assign formControlName to input instead of mat-chip-list, it's always without wrongs
  even when there are no items in the list.</p>