继承和依赖注入 [英] Inheritance and dependency injection

问题描述

我有一组angular2组件，它们都应该注入一些服务。我的第一个想法是，最好创建一个超级类并在那里注入服务。然后我的任何组件都会扩展该超类，但这种方法不起作用。

I have a set of angular2 components that should all get some service injected. My first thought was that it would be best to create a super class and inject the service there. Any of my components would then extend that superclass but this approach does not work.

简化示例：

export class AbstractComponent {
  constructor(private myservice: MyService) {
    // Inject the service I need for all components
  }
}

export MyComponent extends AbstractComponent {
  constructor(private anotherService: AnotherService) {
    super(); // This gives an error as super constructor needs an argument
  }
}

我可以通过在每个组件中注入 MyService 来解决这个问题，并将该参数用于 super（）调用但是这肯定是某种荒谬。

I could solve this by injecting MyService within each and every component and use that argument for the super() call but that's definetly some kind of absurd.

如何正确组织我的组件以便他们从超类继承服务？

How to organize my components correctly so that they inherit a service from the super class?

推荐答案

更新的解决方案，通过使用全局注入器来防止生成myService的多个实例。

Updated solution, prevents multiple instances of myService being generated by using the global injector.

import {Injector} from '@angular/core';
import {MyServiceA} from './myServiceA';
import {MyServiceB} from './myServiceB';
import {MyServiceC} from './myServiceC';

export class AbstractComponent {
  protected myServiceA:MyServiceA;
  protected myServiceB:MyServiceB;
  protected myServiceC:MyServiceC;

  constructor(injector: Injector) {
    this.settingsServiceA = injector.get(MyServiceA);
    this.settingsServiceB = injector.get(MyServiceB);
    this.settingsServiceB = injector.get(MyServiceC);
  }
}

export MyComponent extends AbstractComponent {
  constructor(
    private anotherService: AnotherService,
    injector: Injector
  ) {
    super(injector);

    this.myServiceA.JustCallSomeMethod();
    this.myServiceB.JustCallAnotherMethod();
    this.myServiceC.JustOneMoreMethod();
  }
}

这将确保MyService可以在任何类中使用扩展AbstractComponent而不需要在每个派生类中注入MyService。

This will ensure that MyService can be used within any class that extends AbstractComponent without the need to inject MyService in every derived class.

此解决方案有一些缺点（请参阅我原始问题下面的@GünterZöchbauer的Ccomment）：

There are some cons to this solution (see Ccomment from @Günter Zöchbauer below my original question):

• 当有许多不同的服务需要在许多地方注入时，注入全局注入器只是一种改进。如果您只有一个共享服务，则可能更好/更容易在派生类中注入该服务


• 我的解决方案和他提出的替代方案都有缺点，它们使得它变得更难看看哪个类依赖于什么服务。

有关Angular2中依赖注入的非常好的解释，请参阅此博客帖子，这有助于我大大解决了这个问题： http：/ /blog.thoughtram.io/angular/2015/05/18/dependency-injection-in-angular-2.html

For a very well written explanation of dependency injection in Angular2 see this blog post which helped me greatly to solve the problem: http://blog.thoughtram.io/angular/2015/05/18/dependency-injection-in-angular-2.html

这篇关于继承和依赖注入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！