File

packages/data/src/lib/entry-form/default-entry-input.component.ts

Description

This component holds the input templates for all field types that can not be represented by the default input template.

Extends

DefaultInputComponent

Metadata

templateUrl ./default-entry-input.component.html

Index

Properties
Methods

Constructor

constructor(sdk: SdkService, formService: FormService, keycommands: KeycommandsService)
Parameters :
Name Type Optional
sdk SdkService No
formService FormService No
keycommands KeycommandsService No

Methods

focus
focus(focus)
Inherited from DefaultInputComponent
Parameters :
Name Optional Default value
focus No true
Returns : void
ngAfterViewInit
ngAfterViewInit()
Inherited from DefaultInputComponent
Returns : void

Properties

Public formService
Type : FormService
Public keycommands
Type : KeycommandsService
Public sdk
Type : SdkService
Public control
Type : FormControl
Inherited from DefaultInputComponent

The form control that is used

Public field
Type : Field
Inherited from DefaultInputComponent

The field for which the input is meant.

focusEvent
Type : EventEmitter<boolean>
Default value : new EventEmitter()
Inherited from DefaultInputComponent

Emitter to focus the input field

Public formService
Type : FormService
Inherited from DefaultInputComponent
Public group
Type : FormGroup
Inherited from DefaultInputComponent

The form group that is used

Public item
Type : Item<any>
Inherited from DefaultInputComponent

The item that is targeted by the input

Public keycommands
Type : KeycommandsService
Inherited from DefaultInputComponent
import { Component } from '@angular/core';
import { DefaultInputComponent, FormService, KeycommandsService } from '@ec.components/ui';
import { SdkService } from '../sdk/sdk.service';

/** This component holds the input templates for all field types that can not be represented by the default input template. */
@Component({
  templateUrl: './default-entry-input.component.html',
})
export class DefaultEntryInputComponent extends DefaultInputComponent {
  constructor(public sdk: SdkService, public formService: FormService, public keycommands: KeycommandsService) {
    super(formService, keycommands);
  }
}
<div [ngSwitch]="field.inputView||field.type" *ngIf="group" [formGroup]="group">
  <ec-input-errors [control]="group.get(field.property)"></ec-input-errors>
  <div *ngSwitchCase="'entry-select'">
    <div *ngIf="!field['relation']">
        <marquee>🚂🚃🚃🚃 Caution: Using single entry fields without validation is experimental</marquee>
    </div>
    <ec-entry-select [focusEvent]="focusEvent" [placeholder]="field.placeholder" [formControl]="group.get(field.property)"
      [model]="field['relation']" [id]="field.id" [solo]="true" [config]="field.nestedCrudConfig"></ec-entry-select>
  </div>
  <div *ngSwitchCase="'entries-select'">
    <div *ngIf="!field['relation']">
        <marquee>🚂🚃🚃🚃 No model set in field validation. Use inputView "entries-actionbar" or set validation...</marquee>
    </div>
    <ec-entry-select *ngIf="field['relation']" [focusEvent]="focusEvent" [placeholder]="field.placeholder" [formControl]="group.get(field.property)"
      [model]="field['relation']" [id]="field.id" [config]="field.nestedCrudConfig"></ec-entry-select>
  </div>
  <div *ngSwitchCase="'entries-actionbar'">
    <ec-entry-actionbar [focusEvent]="focusEvent" [placeholder]="field.placeholder" [formControl]="group.get(field.property)"
    [model]="field['relation']" [id]="field.id" [config]="field.nestedCrudConfig"></ec-entry-actionbar>
  </div>
  <div *ngSwitchCase="'entry-list-select'">
    <!--  [placeholder]="field.placeholder" -->
    <!--  [config]="field.nestedCrudConfig" -->
    <div *ngIf="!field['relation']">
        <marquee>🚂🚃🚃🚃 No model set in field validation. Use inputView "entries-actionbar" or set validation...</marquee>
    </div>
    <ec-entry-list-select *ngIf="field['relation']" [formControl]="group.get(field.property)" [model]="field['relation']" [id]="field.id"
      [listConfig]="field.nestedCrudConfig">
    </ec-entry-list-select>
  </div>
  <div *ngSwitchCase="'asset-select'">
    <ec-asset-select [readOnly]="formService.isReadOnly(field, item)" [config]="field.nestedCrudConfig" [placeholder]="field.placeholder"
      [formControl]="group.get(field.property)" [id]="field.id" [solo]="true" assetGroupID="legacyAsset">
    </ec-asset-select>
  </div>
  <div *ngSwitchCase="'assets-select'">
    <ec-asset-select [readOnly]="formService.isReadOnly(field, item)" [config]="field.nestedCrudConfig" [placeholder]="field.placeholder"
      [formControl]="group.get(field.property)" [id]="field.id" assetGroupID="legacyAsset"></ec-asset-select>
  </div>
  <div *ngSwitchCase="'dmAsset-select'">
    <ec-asset-select [readOnly]="formService.isReadOnly(field, item)" [config]="field.nestedCrudConfig" [placeholder]="field.placeholder"
      [formControl]="group.get(field.property)" [id]="field.id" [solo]="true" [assetGroupID]="field['relation']">
    </ec-asset-select>
  </div>
  <div *ngSwitchCase="'dmAssets-select'">
    <ec-asset-select [readOnly]="formService.isReadOnly(field, item)" [config]="field.nestedCrudConfig" [placeholder]="field.placeholder"
      [formControl]="group.get(field.property)" [id]="field.id" [assetGroupID]="field['relation']"></ec-asset-select>
  </div>
  <input *ngSwitchCase="'phone'" type="text" [placeholder]="field.placeholder" [id]="field.id">
  <div *ngSwitchDefault>
    <marquee>🚂🚃🚃🚃 {{field.type}} input coming soon..</marquee>
    <ec-output [field]="field" [item]="item"></ec-output>
  </div>
</div>
Legend
Html element
Component
Html element with directive

result-matching ""

    No results matching ""