🚨 Announcing Vendure v2 Beta

FacetValueSelectorComponent

FacetValueSelectorComponent

A form control for selecting facet values.

Example

<vdr-facet-value-selector
  [facets]="facets"
  (selectedValuesChange)="selectedValues = $event"
></vdr-facet-value-selector>

The facets input should be provided from the parent component like this:

Example

this.facets = this.dataService
  .facet.getAllFacets()
  .mapSingle(data => data.facets.items);

Signature

class FacetValueSelectorComponent implements OnInit, OnDestroy, ControlValueAccessor {
  @Output() selectedValuesChange = new EventEmitter<FacetValueFragment[]>();
  @Input() readonly = false;
  @Input() transformControlValueAccessorValue: (value: FacetValueFragment[]) => any[] = value => value;
  searchInput$ = new Subject<string>();
  searchLoading = false;
  searchResults$: Observable<FacetValueFragment[]>;
  selectedIds$ = new Subject<string[]>();
  onChangeFn: (val: any) => void;
  onTouchFn: () => void;
  disabled = false;
  value: Array<string | FacetValueFragment>;
  constructor(dataService: DataService, changeDetectorRef: ChangeDetectorRef)
  ngOnInit() => void;
  ngOnDestroy() => ;
  onChange(selected: FacetValueFragment[]) => ;
  registerOnChange(fn: any) => ;
  registerOnTouched(fn: any) => ;
  setDisabledState(isDisabled: boolean) => void;
  focus() => ;
  writeValue(obj: string | FacetValue.Fragment[] | Array<string | number> | null) => void;
}

Implements

  • OnInit
  • OnDestroy
  • ControlValueAccessor

Members

selectedValuesChange

property
type:

readonly

property
type:

transformControlValueAccessorValue

property
type:
(value: FacetValueFragment[]) => any[]

searchInput$

property
type:

searchLoading

property
type:

searchResults$

property
type:
Observable<FacetValueFragment[]>

selectedIds$

property
type:

onChangeFn

property
type:
(val: any) => void

onTouchFn

property
type:
() => void

disabled

property
type:

value

property
type:
Array<string | FacetValueFragment>

constructor

method
type:
(dataService: DataService, changeDetectorRef: ChangeDetectorRef) => FacetValueSelectorComponent

ngOnInit

method
type:
() => void

ngOnDestroy

method
type:
() =>

onChange

method
type:
(selected: FacetValueFragment[]) =>

registerOnChange

method
type:
(fn: any) =>

registerOnTouched

method
type:
(fn: any) =>

setDisabledState

method
type:
(isDisabled: boolean) => void

focus

method
type:
() =>

writeValue

method
type:
(obj: string | FacetValue.Fragment[] | Array<string | number> | null) => void