Angular Formly - Clearing Array Property of Model Based on Value of Another Field

Question

I am using Formly for Angular in my app. The model of the form looks like this:

// ins-submission.ts
export class InsSubmission {

    id: number | undefined;
    empID: string = "";
    healthDentalPlanID: string = "";
    visionPlanID: string = '';
    isCurrent: boolean = true;
    deps: Array<Dependent> = new Array<Dependent>();
    bens: Array<Beneficiary> = new Array<Beneficiary>();
    termsAccepted: boolean = false;


    constructor(empId: string) {
        this.empID = empId;
    }
}

// dependent.ts
export class Dependent {
    firstName: string = "";
    middleName: string = "";
    lastName: string = "";
    dob: Date | undefined;
    gender: string = "";
    relationship: DepRelationship = DepRelationship.DEP;
    enrolledPlans: Array<string> = new Array<string>();
    ssn: string = "";


    constructor(relationship: DepRelationship) {
        this.relationship = relationship;
    }
}

In my app, I want to be able to clear the "dep" array based upon what the user selects in the "healthDentalID" or "visionPLanID" control. Partial code used to build my form:

  public buildSubForm(): FormlyFieldConfig[] {
    var fFields = new Array<FormlyFieldConfig>();
    let containerFGroup = { type: "stepper", fieldGroup: [{}] };
    let posPlans = this.formStateService.availPlans;
    let planStep = {
      templateOptions: { label: "Plan Selection", requiredStep: true },
      fieldGroup: [{}]
    };

    let insPlans = posPlans.filter(p => p.planType != PlanType.VIS && p.planType != PlanType.TDOC);
    let visionPlans = posPlans.filter(p => p.planType === PlanType.VIS || p.planType === PlanType.DCLN);


    planStep.fieldGroup.push(this.buildGroup("healthDentalPlanId", "select",
      {
        required: true,
        options: this.optBuilderService.mapToGroupedDropdown(insPlans, "id", "description", "planTypeDescription"),
        change: (field: FormlyFieldConfig, val: any) => {
          this.formStateService.updateHealth(field.formControl?.value);
          if (!this.includeDeps()) { field.model.deps = []; };
        }
      }));

    planStep.fieldGroup.push(this.buildGroup("visionPlanId", "select",
      {
        required: true,
        options: this.optBuilderService.mapToGroupedDropdown(visionPlans, "id", "description", "planTypeDescription"),
        change: (field: FormlyFieldConfig, val: any) => {
          this.formStateService.updateVision(field.formControl?.value);
          if (!this.includeDeps()) { field.model.deps = []; }
        }
      }));

   containerFGroup.fieldGroup.push(planStep);
    containerFGroup.fieldGroup.push(this.buildDepPanel());
    fFields.push(containerFGroup);
    return fFields;
}


  private buildDepPanel(): FormlyFieldConfig {
    let depStep = {
      templateOptions: { label: "Dependents", requiredStep: false },
      expressionProperties: { "templateOptions.requiredStep": (model: any, formState: any, field?: FormlyFieldConfig) => this.includeDeps() },
      fieldGroup: [{}]
    };

    let depArrayContainer = {
      key: 'deps', type: 'repeat', fieldArray: {
        expressionProperties: { 'templateOptions.label': 'model.depRelationship == "SPS" ? "Spouse" : "Dependent"' },
        fieldGroup: new Array<FormlyFieldConfig>()
      }
    };

    let depFields = this.buildDepFGroup();
    for (let i = 0; i < depFields.length; i++) {
      depArrayContainer.fieldArray.fieldGroup.push(depFields[i])
    }
    depStep.fieldGroup.push(depArrayContainer);
    return depStep;
  }

When I change the planID controls, the model is cleared as expected. However, I receive this error: ERROR TypeError: [Formly Error] [Expression "templateOptions.label"] can't access property "depRelationship", model is undefined and the form logic ceases to function as expected (i.e. I can no longer add new "deps" controls).

How can I properly clear my model/form array controls in response to the value change in another?