0

我有如下服务：

@Injectable({
  providedIn: 'root'
})
export class BoxContainerService {
    private boxBehaviour: BehaviorSubject<any[]> = new BehaviorSubject<any[]>([]);

    boxes$ = this.boxBehaviour.asObservable();

    addBox(b: any) {
            if (!b) return;

            this.boxBehaviour.next([...this.boxBehaviour.value, layer]);
    }
}

我正在注入多个组件，如下所示。

@Component({
  selector: 'my-list',
  templateUrl: './my-list.component.html'
})
export class MyListComponent implements OnInit, OnDestroy {

    constructor(private service: BoxContainerService) {     
    }

    ngonInit(){     
    }  
}

但我想在每次路由更改时获取 BoxContainerService 的新实例。当我刷新页面时，会创建新的实例。但如果从 MyList_page 路由到 B_page 并再次路由 MyList_page，则 box$ 计数正在增加。我想在模块期间重新创建服务实例。因为我会在另一个模块中导入模块。

4

2 回答 2

1

您可以从服务的 @Injectable 中删除 providedIn

@Injectable({
})

您可以在组件级别提供服务 -

@Component({
  selector: 'my-list',
  templateUrl: './my-list.component.html',
  providers: [ BoxContainerService ]
})
export class MyListComponent implements OnInit, OnDestroy {

    constructor(private service: BoxContainerService) {     
    }

    ngonInit(){     
    }  
}

每次创建 MyListComponent 时都会创建一个新的 BoxContainerService 实例（在您的情况下，当它被路由到时）

于 2020-06-08T11:18:28.023 回答
0

当你注入一个服务时，它将由它遇到的第一个提供者解决。

现在，您可能在模块级别注册了您的服务。

您可以使您的列表组件（或某些父组件，具体取决于您需要实现的目标）成为给定服务的提供者。这意味着这个组件和所有子组件将把它解析为这个实例——并且将为组件的每个实例创建一个实例。

@Component({
  selector: 'my-list',
  templateUrl: './my-list.component.html',
  providers: [BoxContainerService]
})
export class MyListComponent implements OnInit, OnDestroy {

    constructor(private service: BoxContainerService) {     
    }

    ngonInit(){     
    }  
}
于 2020-06-08T11:20:28.190 回答