Я видел эту тему: Использование нескольких экземпляров одной и той же службы . Можно ли использовать один и тот же несколько экземпляров службы от родительского к дочернему?
Например, у меня есть ElementService в ParentComponent и есть 2 экземпляра этой службы.
{ provide: 'instance1', useClass: ElementService},
{ provide: 'instance2', useClass: ElementService},
Как мне использовать instance1 в Child1Component и instance2 в Child2Component?
Когда вы указываете провайдеров в декораторе компонента, внедряемые провайдеры становятся специфичными для этого компонента, см. Angular — Предоставление зависимостей
Это также полезная информация об внедрении зависимостей.
Поэтому просто укажите службу в массиве поставщиков обоих компонентов, и у вас должны быть уникальные экземпляры службы в обоих компонентах.
@Component({
selector: 'app-page',
templateUrl: './page.component.html',
styleUrls: ['./page.component.scss'],
providers: [
ElementService
]
})
export class PageComponent implements OnInit {...
Вы можете внедрить именованный провайдер в конструктор каждого дочернего компонента (а также в родительский конструктор):
constructor(@Inject('instance1') private service: ElementService) { }
constructor(@Inject('instance2') private service: ElementService) { }
Вот рабочий пример со счетчиком: https://stackblitz.com/edit/angular-ivy-usorby?file=src%2Fapp%2Fchild1%2Fchild1.component.ts
