Question

首先，我是 Angular 世界的新手，有一些 AngularJS 的经验（在这里没用哈哈哈）

我关注 this link 以便为特定模块提供服务/状态。

但是一旦我在模块内部使用它，我就会得到一个循环依赖 Warning: Circular dependency detected

如果出现此错误，我怎么可能使用这样的 providedIn 属性来设置模块？

home-store.service.ts

import { Injectable } from '@angular/core';
import { HomeModule } from './home.module';

export interface IHomeState {
  user?: any;
}

@Injectable({ providedIn: HomeModule }) // I'd like to restrict this service to HomeModule
export class HomeStoreService {}

home-module.ts

import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { HomeComponent } from './home.component';

@NgModule({
  declarations: [HomeComponent],
  imports: [CommonModule, RouterModule.forChild([])],
})
export class HomeModule {}

home-component.ts

import { Component } from '@angular/core';
import { HomeStoreService } from './home-store.service';

@Component({
  selector: 'home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.scss'],
})
export class HomeComponent {
  constructor(private homeStore: HomeStoreService) {}
}

提前致谢。

Answer 1

我建议不要使用providedIn，因为你不需要它。因此，您可以像这样更改代码并获得相同的结果。

home-store.service.ts

export interface IHomeState {
  user?: any;
}

export class HomeStoreService {}

home-module.ts

import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { HomeComponent } from './home.component';
import { HomeStoreService } from 'path/to/service';

@NgModule({
  declarations: [HomeComponent],
  imports: [CommonModule, RouterModule.forChild([])],
  providers: [HomeStoreService]
})
export class HomeModule {}

home-component.ts 无变化

Angular 服务：提供循环依赖问题

1 个答案: