避免在Angular中出现多个服务实例

Question

我在网上进行了一些研究，发现我面临的问题是创建了多个服务实例，而我希望避免这种情况。请问有人能看一下我的代码并指出需要做出的改变吗？

第二个服务使用了被复制的主服务。

export class SecondaryService {
    constructor(private primarySvc: IPrimaryService){
        this.primarySvc.someSubject.subscribe(() => {});
    }
}

主要服务（正在被复制的服务）

export class PrimaryService {
    someSubject: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
    constructor(){}
}

首要服务提供商

@Injectable()
export class PrimaryServiceProvider extends PrimaryService {
     constructor(){
          super();
     }
}

次要服务提供商

@Injectable()
export class SecondaryServiceProvider extends SecondaryService {
    constructor(private PrimaryProvider: PrimaryServiceProvider){
        super(PrimaryProvider);
    }
}

app.module.ts

 @NgModule({
     declaration: [SecondaryComponent],
     exports: [SecondaryComponent],
     imports: [BrowserModule],
     providers: [SecondaryServiceProvider, PrimaryServiceProvider ]
 })
 export class SearchModule{}

现在我正在尝试在本地环境中使用我制作的组件，大致如下：

app.module.ts

 @NgModule({
     declaration: [AppComponent, HomeComponent],
     imports: [SearchModule, BrowserModule],
     providers: [PrimaryServiceProvider, SecondaryServiceProvider],
     bootstrap: [AppComponent]
 })
 export class AppModule{}

home.component.ts

export class HomeComponent {
    constructor( primarySvc: PrimaryServiceProvider, 
        secondarySvc: SecondaryServiceProvider) {
        this.primarySvc.someSubject.next(false);
    }
}

现在我确定主服务有两个实例，因为 someSubject 不同步，并且 SecondarySvc 中的订阅没有从 home.component.ts 获取任何值。

请告诉我需要在哪里进行更改。

谢谢！

- javan.rajpopat

---

你能在https://stackblitz.com/上运行这个应用吗？ - undefined

从SearchModule中移除提供者 - undefined

@DiakoAmir 不幸的是，我不知道如何在 stackblitz.com 上创建本地环境，我觉得如果没有它，我将无法重新创建这个问题。 - undefined

Answer 1

我认为你在过度使用 PrimaryServiceProvider 和 SecondaryServiceProvider 服务，存在过度工程化的风险。

若要创建单例服务，请在 Injectable 装饰器中设置 providedIn: 'root' 选项，如下所示：

@Injectable({ providedIn: 'root' })
export class SecondaryService {}

最后，务必不要在任何providers数组中注册单例服务。

请查看有关此问题的官方文档这里。

- Yasser Nascimento

---

感谢回应 @yasser，这是一个庞大项目的一部分，所以我不能删除其中任何一个服务.. 其次，被复制的是PrimaryService而不是SecondaryService。 - undefined

Answer 2

回答自己的问题：

由于导入时文件路径不正确，服务被复制了。Windows允许您使用大小写不敏感的文件路径，在每次使用该模块时可能会创建多个实例。

- javan.rajpopat

---

对我来说，是在Webstorm中使用Lerna的自动导入功能导致相对路径在不该存在的情况下被创建。 - undefined