Pass ng-content into another component as ng-content

Question

I have got CollapsibleComponent which uses CollapsibleActionsComponent in it. I would like to be able to pass additional action buttons into CollapsibleActionsComponent through CollapsibleComponent as shown in example:

CollapsibleActionsComponent:

<div class="actions">
  <ng-content></ng-content> // this is where I would expect "Additional button" to be projected
  <button>Common button</button>
</div>

CollapsibleComponent:

<div class="header">
  ...
 
  <app-collapsible-actions>
    <ng-content select="[slot=moreCustomActions]"></ng-content>
  </app-collapsible-actions>
</div>

<div class="body">
  <ng-content select="[slot=body]"></ng-content>
</div>

AppComponent:

<app-collapsible>
  <div slot="moreCustomActions">
    <button>Additional button</button>
  </div>

  <div slot=body>
    <p>...</p>
  </div>
</app-collapsible>

The additional button is not shown. This is probably duplicate of some previous question, but I was not able to find it.

During writing this question I realized that I can get rid of the CollapsibleActionsComponent and move it up into CollapsibleComponent because I am not using it elsewhere. However let's assume I would use it.