Validating using formControlName does not work

[lemoncodes91]

[x] bug report => search github for a similar issue or PR before submitting [ ] support request/question

Current behavior

I've encountered some issue when using formControlName and its validators. now, i've followed the documentions with regards to validation [validators] and [errorMessages] but it does not work.

Now, i noticed one thing in your demo, when using [validators] and [errorMessages], it is paired with [ngModel] and it does work. It my case, i am not using [ngModel]. I am using formControlName and i see the validators on FormControl.

          <tag-input [onlyFromAutocomplete]="true"
                    [identifyBy]="'value'"
                    [validators]="tagInputValidators"
                    [errorMessages]="tagInputErrrorMessages"
                    [displayBy]="'key'"
                    theme='bootstrap'
                    formControlName="filter_key">
              <tag-input-dropdown [autocompleteObservable]="filterListObservable"
                                  zIndex="10000"
                                  [identifyBy]="'value'"
                                  [displayBy]="'key'"
                                  [keepOpen]="false"
                                  [showDropdownIfEmpty]="true"
                                  [appendToBody]="false">
              </tag-input-dropdown>
          </tag-input>

Above code does not work. Here is my declaration of validators and error messages

  tagInputValidators = [Validators.required];
  tagInputErrrorMessages = {
    required: "Filter/s are required."
  }

Expected behavior Must be able to display error messages on GUI tag input field

Minimal reproduction of the problem with instructions (if applicable) 1.) Use only formControlName directive and set validators and errorMessages directive of ngx-chips

What do you use to build your app?. Please specify the version Angular CLI: 9.0.7 Node: 12.16.1 OS: win32 x64

Angular version: @angular-devkit/architect 0.900.7 @angular-devkit/build-angular 0.900.7 @angular-devkit/build-optimizer 0.900.7 @angular-devkit/build-webpack 0.900.7 @angular-devkit/core 9.0.7 @angular-devkit/schematics 9.0.7 @angular/localize 9.1.11 @ngtools/webpack 9.0.7 @schematics/angular 9.0.7 @schematics/update 0.900.7 rxjs 6.5.5 typescript 3.7.5 webpack 4.41.2

ngx-chips version: ngx-chips 2.1.0

Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ] MS Edge (new version), Chrome, Firefox