¿Cómo puedo representar un componente que implementa una interfaz?

Digamos que tengo una interfaz (o un componente real)ListItemRenderer y un componenteMyRendererComponent que implementa esa interfaz (o extiende el componente base)

@Component({
    selector: 'my-renderer',
    template: '<div>My renderer</div>'
})
export class MyRendererComponent implements ListItemRenderer {
    ...
}

Me gustaría pasar esta implementación concreta a otro componente, p.

@Component({
    selector: 'my-list',
    template: `
        <ul [renderer]="renderer" [items]="items">
            <li *ngFor="let item of items">
                <!-- what goes here? -->
            </li>
        </ul>
    `
})
export class MyList {
    @Input() renderer: ListItemRenderer;
    @Input() items: any[];
    ...
}

Obviamente, el componente padre tendría una propiedad públicarendererde tipoListItemRenderer. La pregunta es, ¿cómo hago para usar ese componente en mi<li> (ver "que pasa aqui" encima)?

Respuestas a la pregunta(2)

Su respuesta a la pregunta