Extend this when creating a form control that simply wraps an existing form control, to reduce a lot of boilerplate. Warning: You must include a constructor in your subclass.

Example when you don't need to modify the wrapped control's value:

@Component({
  template: `<input [formControl]="formControl">`,
  providers: [provideValueAccessor(StringComponent)],
})
class StringComponent extends WrappedFormControlSuperclass<string> {
  // This looks unnecessary, but is required for Angular to provide `Injector`
  constructor(injector: Injector) {
    super(injector);
  }
}

Example when you need to modify the wrapped control's value:

@Component({
  template: `<input type="datetime-local" [formControl]="formControl">`,
  providers: [provideValueAccessor(DateComponent)],
})
class DateComponent extends WrappedFormControlSuperclass<Date, string> {
  // This looks unnecessary, but is required for Angular to provide `Injector`
  constructor(injector: Injector) {
    super(injector);
  }

  protected innerToOuter(value: string): Date {
    return new Date(value + "Z");
  }

  protected outerToInner(value: Date): string {
    if (value === null) {
      return ""; // happens during initialization
    }
    return value.toISOString().substr(0, 16);
  }
}

Type parameters

  • OuterType

  • InnerType

Hierarchy

Implements

  • Unsubscribable
  • OnDestroy
  • OnChanges
  • ControlValueAccessor

Index

Constructors

constructor

Properties

Protected changeDetectorRef

changeDetectorRef: ChangeDetectorRef

destruction$

destruction$: Observable<undefined>

An observable that emits once when this object is destroyed, then completes.

emitOutgoingValue

emitOutgoingValue: function = noop

Call this to emit a new value when it changes.

formControl

formControl: FormControl = new FormControl()

Bind this to your inner form control to make all the magic happen.

isDisabled

isDisabled: boolean = false

You can bind to this in your template as needed.

lastChangedKeys$

lastChangedKeys$: BehaviorSubject<Set<keyof this>> = new BehaviorSubject<Set<keyof this>>(new Set())

Emits the set of @Input() property names that change during each call to ngOnChanges().

onTouched

onTouched: noop = noop

Call this to "commit" a change, traditionally done e.g. on blur.

Methods

bindToInstance

  • bindToInstance<K>(key: K, value$: Observable<this[K]>): void
  • Binds an observable to one of this directive's instance variables. When the observable emits the instance variable will be updated, and change detection will be triggered to propagate any changes. Use this an an alternative to repeating | async multiple times in your template.

getInput$

  • getInput$<K>(key: K): Observable<this[K]>

handleIncomingValue

  • handleIncomingValue(value: OuterType): void

Protected innerToOuter

  • innerToOuter(value: InnerType): OuterType

ngOnChanges

  • ngOnChanges(changes: SimpleChanges): void

ngOnDestroy

  • ngOnDestroy(): void

Protected outerToInner

  • outerToInner(value: OuterType): InnerType

registerOnChange

  • registerOnChange(fn: function): void

registerOnTouched

  • registerOnTouched(fn: VoidFunction): void

setDisabledState

  • setDisabledState(isDisabled: boolean): void

subscribeTo

  • subscribeTo<T>(observable: Observable<T>, next?: undefined | function, error?: undefined | function, complete?: undefined | function): void

unsubscribe

  • unsubscribe(): void

writeValue

  • writeValue(value: OuterType): void

Legend

  • Module
  • Object literal
  • Variable
  • Function
  • Function with type parameter
  • Index signature
  • Type alias
  • Enumeration
  • Enumeration member
  • Property
  • Method
  • Interface
  • Interface with type parameter
  • Constructor
  • Property
  • Method
  • Index signature
  • Class
  • Class with type parameter
  • Constructor
  • Property
  • Method
  • Accessor
  • Index signature
  • Inherited constructor
  • Inherited property
  • Inherited method
  • Inherited accessor
  • Protected property
  • Protected method
  • Protected accessor
  • Private property
  • Private method
  • Private accessor
  • Static property
  • Static method

Generated using TypeDoc