Expected behavior I have a form in an Angular 7 project and the form loads properly when I click register and the component loads.

Actual behavior In Angular 8 I get the following errors when I click the "Register" button:

RegisterComponent.html:41 ERROR TypeError: Cannot read property 'nativeElement' of null
at MdbInputDirective.ngAfterViewInit (ng-uikit-pro-standard.js:6447)

ERROR TypeError: Cannot read property 'querySelector' of undefined
at MdbInputDirective.initComponent (ng-uikit-pro-standard.js:6500)
at MdbInputDirective.ngAfterViewChecked (ng-uikit-pro-standard.js:6459)

Where RegisterComponent.html line 41 is:

<div class="md-form">

I am using a FormGroup and FormBuilder like:

registerForm: FormGroup;
private fb: FormBuilder
this.registerForm = this.fb.group({
  username: ['', [Validators.required, Validators.pattern('.*\\S.*[a-zA-z0-9_-]'), Validators.minLength(4), Validators.maxLength(30)]],
  knownAs: ['', [Validators.required, Validators.minLength(4), Validators.maxLength(75)]],
  email: ['', [Validators.required, Validators.email, Validators.minLength(4), Validators.maxLength(64)]],
  password: ['',
  [Validators.required, Validators.pattern('^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9]).{8,}$'),
  Validators.minLength(8), Validators.maxLength(60)]],
  confirmPassword: ['',
  [Validators.required, Validators.pattern('^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9]).{8,}$'),
    Validators.minLength(8), Validators.maxLength(60)]]
}, {validator: Validators.compose([this.passwordMatchValidator])}); 
this.createRegisterForm();

And the html looks like:

<form [formGroup]="registerForm" (ngSubmit)="register()">
      <div class="md-form">
    <i class="fa fa-user prefix grey-text"></i>
    <input data-error="Invalid input" data-success="Validated" type="text" class="form-control" id="RegisterCardKnownAs" formControlName="knownAs" maxlength="75" length="75" mdbCharCounter mdbInputDirective>
    <label for="RegisterCardKnownAs" class="font-weight-light">Known As</label>
  </div>
etc...</form>

Resources (screenshots, code snippets etc.) I am using the same form developing a new site that I do on this site: https://www.tragoa.com and then click Register For Free. I can send an email with a link to the project I am working on now.

Does anyone know what has changed or what I could be doing wrong given the information that I have? It seems it is something to do with using class="md-form"? Was there a change from Angular 7 to Angular 8 in MDB Forms / Angular Reactive Forms?

Thank you for any guidance you may be able to provide.