Как правильно внедрить и абстрагировать класс в Angular 2+?

Question

Я пытаюсь внедрить мой dynamicFormServicr, который реализует мой Abstract genericFormService как токен инъекции, но класс никогда не создается должным образом, и функция возвращает неопределенное значение.

Ошибка при HomeComponent.html:1 ERROR TypeError: this.dfs.createFormGroup is not a function

Если я console.log this.dfs Я получаю [DyamicaFormService]

export class DynamicFormComponent implements OnInit {
    @Input() formConfigs: Array<FormConfig>;

    @Input() formGroup: FormGroup;

    form: FormGroup;

    constructor(
        private fb: FormBuilder,
        @Inject(GenericFormServiceToken) private dfs: GenericFormService
    ) {}

    ngOnInit(): void {
        this.form = this.createFormGroup();
    }

    createFormGroup(): FormGroup {
        return this.dfs.createFormGroup(this.formConfigs, this.formGroup);
    }
}

import { GenericFormService } from "./dynamic-form.service";
import { InjectionToken } from "@angular/core";

export const GenericFormServiceToken = new InjectionToken<GenericFormService>(
    "GenericFormService"
);

import {
    GenericFormService,
    DynamicFormService,
} from "./lib/dynamic-form/dynamic-form.service";
import { ValidationErrors } from "@angular/forms";
import { ErrorHandlerService } from "./lib/error-handler/error-handler.service";
import { MyButtonModule } from "./lib/my-button/my-button.module";
import { DynamicFormModule } from "./lib/dynamic-form/dynamic-form.module";
import { BrowserModule } from "@angular/platform-browser";
import { NgModule, APP_INITIALIZER, InjectionToken } from "@angular/core";
import { HttpClient, HttpClientModule } from "@angular/common/http";
import { AppRoutingModule } from "./app-routing.module";
import { AppComponent } from "./app.component";
import { HomeComponent } from "./home/home.component";
import { ErrorHandlerComponent } from "./lib/error-handler/error-handler.component";
import { of } from "rxjs";
import { GenericFormServiceToken } from "./lib/dynamic-form/generic-form-token";

// export function getErrorHandlerService(ehs: ErrorHandlerService) {
//  // return () => ehs.loadErrorMessages();
// }

export abstract class ErrorHandlerServiceAbstract {
    errorMessages: ValidationErrors;
    abstract loadErrorMessages(): Promise<void>;
    abstract setErrorMessages(validators): void;
    abstract getErrorMessages(): ValidationErrors;
}

export let errorMessages = {};

export function loadErrorMessages(http: HttpClient) {
    return () => {
        const promise = http
            .get("/assets/app-validators.json")
            .toPromise()
            .then(
                (errMsgs) => {
                    // this.setErrorMessages(errMsgs);
                    errorMessages = errMsgs;
                },

                (err) => {}
            );
        return promise;
    };
}

export function factoryFunction(http) {
    return () => new ErrorHandlerService(http);
}
@NgModule({
    declarations: [AppComponent, HomeComponent],
    imports: [
        BrowserModule,
        HttpClientModule,
        DynamicFormModule,
        MyButtonModule,
        AppRoutingModule,
    ],
    providers: [
        {
            provide: APP_INITIALIZER,
            useFactory: () => loadErrorMessages,
            deps: [HttpClient],
            multi: true,
        },
        {
            provide: GenericFormServiceToken,
            useClass: DynamicFormService,
            multi: true,
        },
        ErrorHandlerService,
    ],
    bootstrap: [AppComponent],
})
export class AppModule {}