Currently, my service includes a field that represents a ViewContainerRef and a method to set the value of this field.
@Injectable({
providedIn: 'root'
})
export class SomeService {
public viewContainerRef: ViewContainerRef
setViewContainer(viewContainerRef: ViewContainerRef) {
this.viewContainerRef = viewContainerRef
}
//some unique code follows here which relies on the value of viewContainerRef
}
Additionally, I have an abstract base class for each of my components where the SomeService
is injected.
export abstract class AppComponentBase {
viewContainerRef: ViewContainerRef;
someService: SomeService;
constructor(injector: Injector){
this.viewContainerRef = injector.get(ViewContainerRef);
this.modalService = injector.get(ModalService);
this.modalService.setViewContainer(this.viewContainerRef);
}
//further code not related to the above
}
Furthermore, there are several components in use that inherit the "unique code" from SomeService
and extend the AppComponentBase
. It's worth noting that multiple inherited instances can exist within the same view.
My main concern is whether after the page is fully loaded and all components are instantiated, will the
this.someService.viewContainerRef
be unique for each component or will it remain the same?
If it turns out to be the same for each, how could I go about making it uniquely assigned?