How do I inject <dxi-item> into a <dx-accordian> using custom components in angular

I am making a template component and need to be able to inject the dxi-item into a nested dx-accordian. My code is as follow:

mc-component.html:

<div>
<ng-content selection="header">
<dx-accordian>
<ng-content selection="mc-inputs"
</dx-accordian>
<div>


mc-inputs.html:

<dxi-item>
<mc-input />
<mc-input />
<dxi-item>


mc-input.html:

<p>It Works! </p>

Continue reading...