Dynamic content projection of an array of components wrapped in another component

I want to dynamically project a rendered component inside a wrapping component so I can wrap some other HTML around it. Unfortunately, this pattern has been implemented across an app, and refactoring it to is a challenge. It is possible to achieve this with the current markup shown in the Main app HTML?

Main app HTML

<fs-chips>
<ng-container *ngFor="let chip of chips">
<fs-chip
[value]="chip">
{{chip.name}}
</fs-chip>
</ng-container>
</fs-chips>


FsChipsComponent HTML

<ng-container *ngFor="let chip of chips">
<div class="wrapper">
<!-- Project each fs-chip here -->
</div>
</ng-container>

Continue reading...