Я использую Angular 8 для создания своего маленького приложения.В моем приложении у меня есть 2 структурные директивы:
@Directive({
selector: '[parent]',
providers: [
DemoService
]
})
export class ParentDirective implements OnInit {
public constructor(protected viewContainerRef: ViewContainerRef,
protected templateRef: TemplateRef<any>,
public demoService: DemoService) {
}
public ngOnInit() {
this.demoService
.name = 'parent';
this.viewContainerRef.createEmbeddedView(this.templateRef);
}
}
@Directive({
selector: '[child]',
providers: [
DemoService
]
})
export class ChildDirective implements OnInit {
public constructor(protected viewContainerRef: ViewContainerRef,
protected templateRef: TemplateRef<any>,
public demoService: DemoService,
@SkipSelf() public parentDemoService: DemoService) {
}
public ngOnInit() {
this.demoService
.name = 'parent';
console.log(this.parentDemoService.name);
}
}
Все мои 2 директивы инициализируют DemoService, однако в child.directive.ts я также хочу получить доступ к DemoService, который находится в parent.directive.ts.
Следовательно, в child.directive.ts, я объявляю DI следующим образом:
public constructor(protected viewContainerRef: ViewContainerRef,
protected templateRef: TemplateRef<any>,
public demoService: DemoService,
@SkipSelf() public parentDemoService: DemoService) {
}
Это то, что я использовал на html-странице:
<div *parent>
<div>Inside parent</div>
<div *child>
<div>Inside child</div>
</div>
<div *parent>
<div>Inside parent parent</div>
<div *child>
<div>Inside child</div>
</div>
</div>
</div>
</div>
</div>
Я ожидаю, что я могу получить доступ к DemoService вродительская директива через parentDemoService экземпляр, но я получил следующую ошибку:
Ошибка ОШИБКИ: StaticInjectorError (AppModule) [ParentDirective -> DemoService]: StaticInjectorError (Platform: core) [ParentDirective -> DemoService]: NullInjectorError: Нет поставщика услуг DemoService!
Я уже поместил демонстрационный код на stackblitz .
Может кто-нибудь помочь мне в этом?Спасибо.
P / s: Я хочу предоставить новый экземпляр для каждой директивы.Вот почему я использовал провайдера в директиве parent и child
Поскольку некоторые люди не понимают мой вопрос (возможно, он недостаточно ясен), я обновил 2 изображения, чтобы описать мою проблему.
Допустим, DemoService имеет переменную-счетчик, начиная с 1 в родительском и может быть увеличена дочерними структурными директивами.
Это мой ожидаемый результат:
