careplan-editor.component.ts

careplan-editor.component.ts

export class CareplanEditorComponent implements OnInit, OnChanges, OnDestroy {
  @Input() carePlanId: string | null = null;
  
  carePlanForm = this.fb.group<CarePlanFormValue>({
    //there are more, but those are relavant
    start: [null, {
      validators: [
        Validators.required
      ],
      asyncValidators: [
        validateCarePlanDates(this.formName, this.carePlanId, this.carePlanService),
      ]
    }],
    end: [null, {
      validators: [
        Validators.required,
      ],
      asyncValidators: [
        // eslint-disable-next-line
        validateCarePlanDates(this.formName, this.carePlanId, this.carePlanService),
      ]
    }],
  });
  
  //you asked about my constructor
  constructor(
    private query: CarePlanQuery,
    private fb: FormBuilder,
    private carePlanService: CarePlanService,
    private carePlanQuery: CarePlanQuery,
    public vc: ViewContainerRef,
    public store: CarePlanStore,
    private fm: AkitaNgFormsManager,
  ) {
    if (!this.DialogViewContainerRef) {
      this.DialogViewContainerRef = vc;
    }
  }

}

and the validator itselft looks like this, for now

import { AsyncValidatorFn } from '@ngneat/reactive-forms';
import { distinctUntilChanged, map, switchMap, tap } from 'rxjs/operators';

export const validateCarePlanDates = (scope: string, id: string, service: CarePlanService): AsyncValidatorFn => control => {

  if (!id) { return; }

  console.log('enterValidate', scope, id, service);
  const plans = service.searchCareplansOfGivenResource(scope, id).pipe(
    map((res) => res),
    tap((res) => console.log('inside validateCarePlanDates', res)),
  );
  return plans;
};