Angular 2 Custom validator that depends on another form control
<p>I'm trying to make a custom validator for my FormControl <code>mealType</code></p>

<p>If my FormControl <code>category</code> has a value and <code>mealType</code> does not, <code>mealType</code> should be invalid.</p>

<p>If <code>category</code> has no value, <code>mealType</code> should be valid. </p>

<p>I'm getting a console error:</p>

<blockquote>
  <p>TypeError: Cannot read property 'get' of undefined</p>
</blockquote>

<p>code:</p>

<pre><code>ngOnInit() {
    this.findForm = this.formBuilder.group({
        categories: [null, Validators.required],
        mealTypes: [null, this.validateMealType],
        distanceNumber: null,
        distanceUnit: 'kilometers',
        keywords: null,
    });
}

validateMealType() {
    if (this.findForm.get('categories').value) {
        if (this.findForm.get('mealTypes').value) {
            var mealTypeError = false;
        } else {
            var mealTypeError = true;
        }
    } else {
        var mealTypeError = false;
    }

    return mealTypeError ? null : {
        error: true
    }
}
</code></pre>

<p>It is my form that is undefined.</p>

<p>How do I resolve this?</p>

<p>Trying this:</p>

<pre><code>validateMealType(categoryControl: FormControl, mealTypeControl: FormControl) {
    if (categoryControl.value) {
        if (!mealTypeControl.value) {
            var mealTypeError = true;
        } else {
            var mealTypeError = false;
        }
    } else {
        var mealTypeError = false;
    }

    return mealTypeError ? null : {
        error: true
    }
}
</code></pre>

<p>but it causes:</p>

<blockquote>
  <p>Error in
  app/find-page/subcomponents/find-page/find-form.component.html:36:5
  caused by: Cannot read property 'value' of undefined</p>
</blockquote>

<p>trying this:</p>

<pre><code>class MealTypeValidator {

    constructor(private categoryFormControl: FormControl) { }

    mealTypeValidator(control: FormControl): { [error: string]: any } {
        if (this.categoryFormControl.value) {
            if (!control.value) {
                return { error: true };
            }
        }
    }
}
</code></pre>

<p>then in my form component:</p>

<pre><code>ngOnInit() {
    this.findForm = this.formBuilder.group({
        categories: [null, Validators.required],
        mealTypes: [null, new MealTypeValidator(this.findForm.get('categories').mealTypeValidator()],
        distanceNumber: null,
        distanceUnit: 'kilometers',
        keywords: null,
    });
}
</code></pre>

<p>but I have compilation errors. How do I get this right? I think i'm just a bit off on both the validation class I made and the usage of it. </p>