Angular2 передать динамический контент компоненту

У меня есть ListComponent, который в основном петли в массиве объектов с ngFor + некоторыми функциями.

Я хотел бы иметь возможность передавать разные "элементы" в качестве контента ListComponent следующим образом:

<list-component>
    <item-component [SomeInput]="someInput">
        <some-content></some-content>
    </item-component>
</list-component>

и в другом месте:

<list-component>
     <different-item-component [SomeInput]="someInput">
         <some-content></some-content>
     </different-item-component>
</list-component>

а затем в моем ListComponent

<ul>
    <li *ngFor="let item of items">
        <!-- ng-content can be different item components -->
        <ng-content [Item]="item" ></ng-content>
    </li>
</ul>

Я знаю, что ng-content является статическим, и элемент не может быть передан как вход. (Это просто для иллюстрации желаемого поведения...)

Я пытался достичь этого, используя template и TemplateRef, как в этом :

но он работает только в том случае, если я помещаю тег template непосредственно внутри <list-component> не работает, если поместить template внутри шаблона item-component и использовать его как указано выше.

Как я могу заставить его работать или есть другой способ достичь этого?

ОТВЕТЫ