--- title: "ZoneSelectorComponent" generated: true --- A form control for selecting zones. ```ts title="Signature" class ZoneSelectorComponent implements ControlValueAccessor { @Output() selectedValuesChange = new EventEmitter(); @Input() readonly = false; @Input() transformControlValueAccessorValue: (value: Zone | undefined) => any = value => value?.id; selectedId$ = new Subject(); onChangeFn: (val: any) => void; onTouchFn: () => void; disabled = false; value: string | Zone; zones$ = this.dataService .query(GetZoneSelectorListDocument, { options: { take: 999 } }) .mapSingle(result => result.zones.items); constructor(dataService: DataService, changeDetectorRef: ChangeDetectorRef) onChange(selected: Zone) => ; registerOnChange(fn: any) => ; registerOnTouched(fn: any) => ; setDisabledState(isDisabled: boolean) => void; focus() => ; writeValue(obj: string | Zone | null) => void; } ``` * Implements: ControlValueAccessor

### selectedValuesChange ### readonly ### transformControlValueAccessorValue Zone | undefined) => any`} /> ### selectedId$ ### onChangeFn void`} /> ### onTouchFn void`} /> ### disabled ### value Zone`} /> ### zones$ ### constructor DataService, changeDetectorRef: ChangeDetectorRef) => ZoneSelectorComponent`} /> ### onChange Zone) => `} /> ### registerOnChange `} /> ### registerOnTouched `} /> ### setDisabledState void`} /> ### focus `} /> ### writeValue Zone | null) => void`} />