为了账号安全,请及时绑定邮箱和手机立即绑定

避免 Angular 中的多个服务实例

避免 Angular 中的多个服务实例

慕桂英4014372 2022-10-27 14:35:18
我在网上做了一些研究,我发现我面临的问题是正在创建多个服务实例,我想避免这种情况。有人可以看看我的代码并发现我需要做的改变。使用被复制的主要服务的第二个服务。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.tsexport class HomeComponent {    constructor( primarySvc: PrimaryServiceProvider,         secondarySvc: SecondaryServiceProvider) {        this.primarySvc.someSubject.next(false);    }}现在我确定主服务有两个实例,因为someSubject它不同步,并且 SecondarySvc 中的订阅没有从 home.component.ts 获取任何值请告诉我我需要在哪里进行更改
查看完整描述

2 回答

?
一只名叫tom的猫

TA贡献1906条经验 获得超3个赞

回答我自己的问题:

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


查看完整回答
反对 回复 2022-10-27
?
慕斯王

TA贡献1864条经验 获得超2个赞

我认为您在使用PrimaryServiceProvider和SecondaryServiceProvider服务进行过度设计。


要创建单例服务,只需在装饰器中设置providedIn: 'root'选项,如下所示:Injectable


@Injectable({ providedIn: 'root' })

export class SecondaryService {}

最后,确保不要在任何providers阵列上注册单例服务。


在此处查看有关此的官方文档。


查看完整回答
反对 回复 2022-10-27
  • 2 回答
  • 0 关注
  • 117 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号