packages/data/src/lib/entry-form/default-entry-output.component.ts
This component holds the templates for all output types that cannot be represented by the default output component.
| selector | ec-default-entry-output |
| templateUrl | ./default-entry-output.component.html |
Properties |
| field |
Type : Field
|
|
The field to output. |
| item |
Type : Item<any>
|
|
The item to display |
import { Component } from '@angular/core';
import { Field, Item } from '@ec.components/core';
/** This component holds the templates for all output types that cannot be represented by the default output component. */
@Component({
selector: 'ec-default-entry-output',
templateUrl: './default-entry-output.component.html',
})
export class DefaultEntryOutputComponent {
/** The field to output. */
field: Field;
/** The item to display */
item: Item<any>;
}
<div [ngSwitch]="field.getView('output')">
<div class="ec-output-asset" *ngSwitchCase="'asset'" [class.is-true]="item?.resolve(field.property)">
<ec-icon name="image"></ec-icon>
</div>
<div class="ec-output-assets" *ngSwitchCase="'assets'" [class.is-true]="item?.resolve(field.property)">
<ec-icon name="images"></ec-icon>
<strong>{{ item?.resolve(field.property)?.length }}</strong>
</div>
<div class="ec-output-asset" *ngSwitchCase="'dmAsset'" [class.is-true]="item?.resolve(field.property)">
<ec-icon name="image"></ec-icon>
</div>
<div data-flex class="ec-output-assets" *ngSwitchCase="'dmAssets'" [class.is-true]="item?.resolve(field.property)">
<ec-icon name="images"></ec-icon>
<strong>{{ item?.resolve(field.property)?.length }}</strong>
</div>
<div *ngSwitchDefault>
<!--<marquee>🚂🚃🚃🚃 {{field.type}} output coming soon!</marquee>-->
{{ item?.display(field.property) }}
</div>
</div>