Angular:注入抽象依赖

时间:2020-08-12 09:40:37

标签: angular dependency-injection

我有一个名为EntityService的“抽象”服务。此服务专用于其他服务,例如ExerciseService,FooService等。其他组件:DeleteModal具有EntityService作为依赖项。为了创建此模式,我需要指定依赖关系解析,但始终会出现以下错误:

ERROR NullInjectorError: R3InjectorError(AppModule)[EntityService -> EntityService -> EntityService]: 
  NullInjectorError: No provider for EntityService!
export class ExerciseDetailComponent {

  constructor(public modalService: NgbModal) { }

  delete() {
    const customInjector = Injector.create({ providers: [{provide: EntityDeleteModalComponent, deps: [{provide: EntityService, useClass: ExerciseService}, AlertService]}] });
    const modalRef = this.modalService.open(EntityDeleteModalComponent, { injector: customInjector });
    modalRef.componentInstance.name = 'DeleteModalExercise';
  }

}

export class EntityDeleteModalComponent {

  loading = false;
  @Input() id: string;
  @Output('action') eventEmitter = new EventEmitter();

  constructor(
    public entityService: EntityService<Entity>,
    public alertService: AlertService
  ) {}

  delete() {
    const subscription = this.entityService.delete(this.id)
      .subscribe({
        next: data => {
          this.loading = false;
          subscription.unsubscribe();
          this.eventEmitter.emit('deleted');
        },
        error: error => {
          this.loading = false;
          subscription.unsubscribe();
          this.alertService.error(error.message);
          this.eventEmitter.emit('error');
        }
    });
  }

  export class EntityService<T extends Entity> {
    // Code omitted
  }

  @Injectable({
     providedIn: 'root'
  })
  export class ExerciseService extends EntityService<Exercise> {
     // Code omitted
  }
}

此外,我尝试使用customUseFactory,但结果相同:

export class ExerciseDetailComponent {

  @Input() exercise$: Observable<Exercise>;
  enableEdit = true;

  constructor(public modalService: NgbModal) { }

  delete() {
    const customUseFactory = (
      httpClient: HttpClient,
      alertService: AlertService
    ) => new EntityDeleteModalComponent(new ExerciseService(httpClient), alertService);

    const customInjector = Injector.create({ providers: [{ provide: EntityDeleteModalComponent, useFactory: customUseFactory, deps: [ExerciseService, AlertService] }]});
    console.log(customInjector);
    const modalRef = this.modalService.open(EntityDeleteModalComponent, { injector: customInjector });
    modalRef.componentInstance.name = 'DeleteModalExercise';
  }

}

当依赖项为EntityService时,应如何声明喷油器以解析ExerciseService?

0 个答案:

没有答案