Angular обертка родитель / ребенок с angular -сплит

Question

Я пытаюсь создать оболочку для модуля angular -split . Существует довольно хорошая документация , а также некоторые примеры кода .

Мое текущее решение основано на этом вопросе .

Исходный пример выглядит следующим образом:

<as-split #split direction="horizontal">
  <as-split-area size="40">my First Split</as-split-area>
  <as-split-area size="60">my Second Split</as-split-area>
</as-split>

Но когда я использую такие обертки, он ломается.

<app-my-split #split direction="horizontal">
  <app-my-split-area size="40">my First Split</app-my-split-area>
  <app-my-split-area size="60">my Second Split</app-my-split-area>
</app-my-split>

Я создал пример стекаблица, чтобы показать свои попытки: https://stackblitz.com/edit/angular-r1eojq

Мне кажется, проблема в том, что viewchild в компоненте my-split не инициализируется до фазы afterViewInit angular, что, по-моему, слишком поздно. Но его нужно инициализировать для внутреннего компонента. И инициализировать его самому так:

// this.split = new SplitComponent(ngZone, elRef, cdRef, renderer);

- это не то, как должны работать viewchilds.

Кто-нибудь получил идею, как правильно создать эту оболочку?