We are trying to style an existing slot (SiteLinks) that contain a number of CMSLinkComponents. We are failing to obtain the full data of the components, because we are only receive the uid
and typeCode
when we use let-[var]
syntax on the ng-template.
Are there example of how to access the full data for these components, without requesting them separately based on the uid
?
<ng-template cxOutletRef="SiteLinks" let-data>
<pre>{{ data.components$ | async | json }}</pre>
</ng-template>
The context model depends on where outlets are used. In your case context is a Slot model, and on this level of hierarchy you have only list of components and not their data, because data you should get separately.
I believe, this approach will work:
<ng-template cxOutletRef="SiteLinks" let-slot>
<ng-container *ngFor="let component of (slot.components$ | async)">
<ng-container [cxComponentWrapper]="component"></ng-container>
</ng-container>
</ng-template>
cxComponentWrapper
also can be helpful in cases when you need handle nested components.