javascript - 避免 Angular 中的多个服务实例

标签 javascript angular typescript angular6 singleton

我在网上做了一些研究,我发现我面临的问题是正在创建多个服务实例,我想避免这种情况。有人可以看看我的代码并找出我需要进行的更改吗?

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

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);
    }
}

应用程序模块.ts

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

现在我尝试使用我在本地环境中制作的组件,它看起来像这样:

应用程序模块.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 中获取任何值

请告诉我哪里需要修改

谢谢!!

最佳答案

回答我自己的问题:

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

关于javascript - 避免 Angular 中的多个服务实例,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62705886/

相关文章:

javascript - Angular js typescript 中的 Http promise

Javascript 错误地更改了简单乘法的结果。我该如何解决?

javascript - 通过 stringify 从 js 数组到 php

Angular(5)-Electron 串口支持

angular - Angular 应用的 Nginx 反向代理

typescript - 使用扩展泛型时 `keyof T` 和 `Extract<keyof T, string>` 有什么区别?

javascript - 使用 React TSX 有条件地验证可见字段 React-hook-forms 是的

javascript - Angular 模块不可用 Karma Jasmine

javascript - 当我单击另一个 div 中的按钮时,如何为 div 添加 css 样式

javascript - 如何在 Angular 中获取数据模型的类名?