src/app/core/default-values/x-dynamic-placeholder/admin-default-value-dynamic/admin-default-value-dynamic.component.ts

Extends

CustomFormControlDirective<DefaultValueConfigDynamic>

Implements

OnInit

Metadata

Relationships

Index

Properties
Methods
Inputs
Outputs

Inputs

aria-describedby
Type : string
disabled
Type : boolean
ngControl
Type : any
Default value : inject(NgControl, { optional: true, self: true })
placeholder
Type : string
required
Type : boolean
value
Type : T

Outputs

valueChange
Type : EventEmitter

Methods

blur
blur()
Returns : void
focus
focus()
Returns : void
onContainerClick
onContainerClick(event: MouseEvent)
Parameters :
Name Type Optional
event MouseEvent No
Returns : void
registerOnChange
registerOnChange(fn: any)
Parameters :
Name Type Optional
fn any No
Returns : void
registerOnTouched
registerOnTouched(fn: any)
Parameters :
Name Type Optional
fn any No
Returns : void
setDescribedByIds
setDescribedByIds(ids: string[])
Parameters :
Name Type Optional
ids string[] No
Returns : void
setDisabledState
setDisabledState(isDisabled: boolean)
Parameters :
Name Type Optional
isDisabled boolean No
Returns : void
writeValue
writeValue(value: T, notifyFormControl: unknown)

Implementation for Angular ControlValueAccessor interface that links the form control value to the component value

Parameters :
Name Type Optional Default value Description
value T No

The new value to set

notifyFormControl unknown No false

Whether to notify the FormControl of this change (for internal updates)

Returns : void

Properties

internalControl
Type : FormControl<string>
controlType
Type : string
Default value : "custom-control"
elementRef
Type : unknown
Default value : inject<ElementRef<HTMLElement>>(ElementRef)
Readonly enabled
Type : Signal<boolean>
Default value : computed(() => !this._disabled())

Whether the control is currently enabled, as a signal (tracks disabled).

errorStateMatcher
Type : unknown
Default value : inject(ErrorStateMatcher)
id
Type : unknown
Default value : `custom-form-control-${CustomFormControlDirective.nextId++}`
Static nextId
Type : number
Default value : 0
onChange
Type : unknown
Default value : () => {...}
onTouched
Type : unknown
Default value : () => {...}
parentForm
Type : unknown
Default value : inject(NgForm, { optional: true })
parentFormGroup
Type : unknown
Default value : inject(FormGroupDirective, { optional: true })
stateChanges
Type : unknown
Default value : new Subject<void>()
Readonly valueSignal
Type : Signal<T>
Default value : computed(() => this._value())

The current value of the control as a signal. Authoritative in both modes: it reflects the bound FormControl (synced in ngDoCheck) as well as [(value)] / writeValue updates.

import { Component, OnInit, ChangeDetectionStrategy } from "@angular/core";
import { FormControl, ReactiveFormsModule } from "@angular/forms";
import { CustomFormControlDirective } from "../../../common-components/basic-autocomplete/custom-form-control.directive";
import { DefaultValueConfigDynamic } from "../default-value-config-dynamic";
import { MatOption, MatSelect } from "@angular/material/select";
import { MatTooltip } from "@angular/material/tooltip";
import { MatFormFieldControl } from "@angular/material/form-field";

@Component({
  changeDetection: ChangeDetectionStrategy.OnPush,
  selector: "app-admin-default-value-dynamic",
  imports: [MatOption, MatSelect, MatTooltip, ReactiveFormsModule],
  templateUrl: "./admin-default-value-dynamic.component.html",
  styleUrl: "./admin-default-value-dynamic.component.scss",
  providers: [
    {
      provide: MatFormFieldControl,
      useExisting: AdminDefaultValueDynamicComponent,
    },
  ],
})
export class AdminDefaultValueDynamicComponent
  extends CustomFormControlDirective<DefaultValueConfigDynamic>
  implements OnInit
{
  internalControl: FormControl<string>;

  ngOnInit() {
    this.internalControl = new FormControl(this.value?.value);
    this.internalControl.valueChanges.subscribe(
      (v) => (this.value = { value: v }),
    );
  }
}
<mat-select [formControl]="internalControl">
  <mat-option
    value="$now"
    matTooltip="Fill the current date initially, when a record is created."
    i18n-matTooltip
    i18n
    >Current Date
  </mat-option>

  <mat-option
    value="$current_user"
    matTooltip="Fill the currently logged in user, when a record is created."
    i18n-matTooltip
    i18n
    >Current User
  </mat-option>
</mat-select>

./admin-default-value-dynamic.component.scss


mat-select {
  font-style: italic;
}
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""