DI и вступление

Question

У меня есть три компонента, где componentC отображается как содержимое componentB и получает componentB DI'ed в своем конструкторе.

@Component({ 
    selector: 'componentA', 
    template: ` 
    <componentB> 
     <componentC></componentB> 
     <ng-content></ng-content> 
    </componentB>` 
.... 
export class ComponentC { 
    constructor(private cmpB: ComponentB) 

Теперь я использую componentA из другого компонента и хочу использовать перенаправление на поставку дополнительных componentC сек к нему через <ng-content> что я кладу в шаблоне componentA «s:

<componentA> 
    <componentC></componentC> 
</componentA> 

Это вызывает No provider for ComponentB. Используя <ng-content>, я определил, что содержимое должно появиться внутри <componentB>, поэтому DI должен иметь возможность найти объект ComponentB, являющийся родителем точки вставки.

Возможно ли это? Угловая создает мой дополнительный ComponentC непосредственно в целевом местоположении или сначала там, где разметка перемещает его? Есть ли способ настроить поставщиков для этого?

Answer 1

не включение делает componentC чадом componentB, он остается дитем componentA, только там, где это показано в рамках DOM изменяется.

Я не вижу простой способ сделать инъекционную работу.

Вы могли бы сделать componentA предоставить услугу, где componentA присваивает ссылку на componentB

@Component({ 
    ... 
    providers: [ComponentBProviderService], 
class ComponentA { 
    @ViewChild(ComponentB) componentB:ComponentB; 
    constructor(private bProvider: ComponentBProviderService){} 
    ngAfterViewInit() { 
    this.bProvider.component = this.componentB; 
    } 
} 

Когда ComponentC впрыскивает эту услугу он получит доступ к componentB. Имеет смысл использовать услугу Observable, чтобы активно уведомлять componentC, когда ссылка станет доступной.

class ComponentC { 
    componentB:ComponentB; 
    constructor(bProvider: ComponentBProviderService){ 
    bProvider.componentAvailable.subscribe(val => this.componentB = val); 
    } 
}