title: Reactive Form name unique validator
body: <p>I'm doing a web application in Angular 6 and I'm using Reactive Form. I have a <code>name</code> field that I want to validate if it's unique or not. I'm comparing its value with an array.</p>
  
  <pre><code>companies: Company[];
  
  this.companyFormGroup = this.fb.group({
        name: [null, Validators.required],
        emailAddress: [null, Validators.compose([Validators.required, Validators.email])]
      }, {validator: this.uniqueValidator});
  
  uniqueValidator(control: AbstractControl) {
      const name = control.get('name').value;
  
      if (control.get('name').valid) {
        const isNameUnique = this.companies.map(company =&gt; company.name).some(value =&gt; value === name);
  
        if (!isNameUnique) {
          console.log(isNameUnique);
          control.get('name').setErrors({unavailable: true});
        }
      }
    }
  </code></pre>
  
  <blockquote>
    <p>Cannot read property 'companies' of undefined
        at push../src/app/modules/create-company/create-company.component.ts.CreateCompanyComponent.uniqueValidator
    (create-company.component.ts:79)
        at forms.js:602
        at Array.map ()
        at _executeValidators (forms.js:602)
        at FormGroup.validator (forms.js:567)</p>
  </blockquote>
  
  <p>My goal is to present an error if the name that the user has entered already exists and remove the error if the name is unique.</p>