<ng-template vdrDialogTitle>{{ 'settings.select-zone' | translate }}</ng-template>

<ng-select
    [items]="allZones"
    bindLabel="name"
    bindValue="id"
    appendTo="body"
    [addTag]="canCreateNewZone"
    (change)="onChange($event)"
></ng-select>

<ng-template vdrDialogButtons>
    <button type="button" class="btn" (click)="cancel()">{{ 'common.cancel' | translate }}</button>
    <button type="submit" (click)="select()" [disabled]="!selected" class="btn btn-primary">
        <span *ngIf="!!selected && !selected.id">{{ 'settings.create-zone' | translate }}</span>
        <span *ngIf="!selected || selected.id">{{ 'settings.select-zone' | translate }}</span>
    </button>
</ng-template>
