Вызов метода компонента, который находится внутри ‹ng-content› в его родительском компоненте.

Прежде всего, это Plunkr.

По сути, у меня есть динамическая вкладка. Будет любое количество вкладок, каждая из которых будет содержать компонент, унаследованный от этого компонента 'Delay-load'. Функциональность, которую я хочу достичь, заключается в том, что когда пользователь нажимает на вкладку, он затем вызывает loadData из любого компонента, содержащегося на вкладке.

Я попытался получить доступ к дочернему компоненту с помощью @ViewChild или @ContentChild, но ничего из того, что я пытаюсь сделать, похоже, не работает.

Шаблон вкладки:

<div [hidden]="!active" class="pane">
  <ng-content></ng-content>
</div>

И в установщике свойства active в компоненте tab я хочу вызвать метод .loadData () любого компонента, содержащегося в элементе. Это достижимо?


typescript angular transclusion
person Cameron W.    schedule 03.04.2017    source источник
comment
plnkr.co/edit/YA3WFkE1L3WJNyjspeWr?p=preview   -  person yurzui    schedule 03.04.2017
comment
@yurzui это очень помогло, если вы хотите отправить ответ (с небольшим описанием), я отмечу его как решение! :) Спасибо!   -  person Cameron W.    schedule 04.04.2017

Ответы (1)


arrow_upward
0
arrow_downward

У меня работает с

  ngAfterContentInit() {
    if(this.component) {
      this.component.loadData();
    }
  }

  @ContentChild(DelayLoadComponent) component: DelayLoadComponent;

но он не загружает компонент лениво.

Пример Plunker

Возможно, вы хотите добавить *ngIf, который добавляет компонент в DOM только тогда, когда вкладка активна.

person Günter Zöchbauer    schedule 03.04.2017
comment
к сожалению, я ищу ленивую загрузку компонента! - person Cameron W.; 04.04.2017
comment
Но проблема не в ленивой загрузке. Ваше приложение не загружает компонент лениво. - person Günter Zöchbauer; 04.04.2017
comment
Но вот чего я пытаюсь достичь, задавая этот вопрос? Я знаю, что компонент не загружается лениво - вот почему я здесь! :) - person Cameron W.; 05.04.2017
comment
Весь ваш вопрос не содержит lazy один раз ;-) Есть вопросы и ответы, как лениво загружать компоненты без роутера. Вы также можете использовать *ngIf, если хотите, чтобы компонент был добавлен в DOM только тогда, когда он виден. Ленивая загрузка - это загрузка компонента с другого (отличного от исходного файла кода приложения) с сервера. - person Günter Zöchbauer; 05.04.2017