zone-selector-component.md 3.8 KB
title: "ZoneSelectorComponent" weight: 10 date: 2023-07-14T16:57:51.254Z showtoc: true
generated: true
ZoneSelectorComponent
# ZoneSelectorComponent
{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/components/zone-selector/zone-selector.component.ts" sourceLine="40" packageName="@vendure/admin-ui">}}
A form control for selecting zones.
## Signature
```TypeScript
class ZoneSelectorComponent implements ControlValueAccessor {
@Output() @Output() selectedValuesChange = new EventEmitter();
@Input() @Input() readonly = false;
@Input() @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 } }, 'cache-first')
.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
## Members
### selectedValuesChange
{{< member-info kind="property" type="" >}}
{{< member-description >}}{{< /member-description >}}
### readonly
{{< member-info kind="property" type="" >}}
{{< member-description >}}{{< /member-description >}}
### transformControlValueAccessorValue
{{< member-info kind="property" type="(value: Zone | undefined) => any" >}}
{{< member-description >}}{{< /member-description >}}
### selectedId$
{{< member-info kind="property" type="" >}}
{{< member-description >}}{{< /member-description >}}
### onChangeFn
{{< member-info kind="property" type="(val: any) => void" >}}
{{< member-description >}}{{< /member-description >}}
### onTouchFn
{{< member-info kind="property" type="() => void" >}}
{{< member-description >}}{{< /member-description >}}
### disabled
{{< member-info kind="property" type="" >}}
{{< member-description >}}{{< /member-description >}}
### value
{{< member-info kind="property" type="string | Zone" >}}
{{< member-description >}}{{< /member-description >}}
### zones$
{{< member-info kind="property" type="" >}}
{{< member-description >}}{{< /member-description >}}
### constructor
{{< member-info kind="method" type="(dataService: DataService, changeDetectorRef: ChangeDetectorRef) => ZoneSelectorComponent" >}}
{{< member-description >}}{{< /member-description >}}
### onChange
{{< member-info kind="method" type="(selected: Zone) => " >}}
{{< member-description >}}{{< /member-description >}}
### registerOnChange
{{< member-info kind="method" type="(fn: any) => " >}}
{{< member-description >}}{{< /member-description >}}
### registerOnTouched
{{< member-info kind="method" type="(fn: any) => " >}}
{{< member-description >}}{{< /member-description >}}
### setDisabledState
{{< member-info kind="method" type="(isDisabled: boolean) => void" >}}
{{< member-description >}}{{< /member-description >}}
### focus
{{< member-info kind="method" type="() => " >}}
{{< member-description >}}{{< /member-description >}}
### writeValue
{{< member-info kind="method" type="(obj: string | Zone | null) => void" >}}
{{< member-description >}}{{< /member-description >}}