src/components/location-overview/location-overview.component.ts
This component displays the metadata and address information belonging to a LocationOverviewComponentData.
encapsulation | ViewEncapsulation.None |
selector | fs-location-overview |
templateUrl | ./location-overview.component.html |
Properties |
|
constructor(componentData: CmsComponentData<LocationOverviewComponentData>)
|
||||||
Parameters :
|
Public componentData |
Type : CmsComponentData<LocationOverviewComponentData>
|
import { Component, ViewEncapsulation } from '@angular/core';
import { CmsComponentData } from '@spartacus/storefront';
import { LocationOverviewComponentData } from './location-overview.model';
/**
* This component displays the metadata and address information belonging to a {@link LocationOverviewComponentData}.
*/
@Component({
selector: 'fs-location-overview',
templateUrl: './location-overview.component.html',
encapsulation: ViewEncapsulation.None,
standalone: false
})
export class LocationOverviewComponent {
constructor(public componentData: CmsComponentData<LocationOverviewComponentData>) {}
}
<ng-container *ngIf="componentData?.data$ | async as convertedData">
<div [attr.data-preview-id]="convertedData.previewId" class="fs-location-overview">
<div class="fs-location-overview-headline">
<h2>{{ convertedData.headline }}</h2>
</div>
<ng-container *ngFor="let location of convertedData.locations" [cxComponentWrapper]="location">
<div [attr.data-preview-id]="location.uid" class="fs-locations">
<p>
{{ location.street }} {{ location.number }}<br />
{{ location.zip }} {{ location.city }}
</p>
</div>
</ng-container>
</div>
</ng-container>