select inputs können gecleart werden

This commit is contained in:
Lorenz Hilpert
2023-07-14 17:14:44 +02:00
parent 4965976f6c
commit 4bd4158dab
2 changed files with 16 additions and 2 deletions

View File

@@ -1,6 +1,9 @@
<div class="shared-select-toggle" [class.has-value]="hasValue" [class.is-open]="isOpen" (click)="toggle()">
<span class="shared-select-display-value truncate">{{ displayValue }}</span>
<shared-icon class="shared-select-arrow" [icon]="!isOpen ? 'arrow-drop-down' : 'arrow-drop-up'"></shared-icon>
<div class="grid grid-flow-col gap-2">
<shared-icon class="shared-select-arrow" [icon]="!isOpen ? 'arrow-drop-down' : 'arrow-drop-up'"></shared-icon>
<shared-icon *ngIf="clearableEnabled && value" class="shared-select-clear" icon="close" (click)="setValue(clearValue)"></shared-icon>
</div>
</div>
<div class="shared-select-options-outlet">
<div class="shared-select-options" [class.is-open]="isOpen" [class.force-close]="forceClose">

View File

@@ -21,6 +21,7 @@ import { IconComponent } from '@shared/components/icon';
import { BaseFormControlDirective } from '@shared/components/form-control';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { NgIf } from '@angular/common';
@Component({
selector: 'shared-select',
@@ -30,7 +31,7 @@ import { takeUntil } from 'rxjs/operators';
encapsulation: ViewEncapsulation.None,
host: { class: 'shared-select' },
standalone: true,
imports: [IconComponent],
imports: [IconComponent, NgIf],
providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: SelectComponent, multi: true }],
})
export class SelectComponent<T = any> extends BaseFormControlDirective implements ControlValueAccessor, AfterContentInit, OnDestroy {
@@ -51,6 +52,16 @@ export class SelectComponent<T = any> extends BaseFormControlDirective implement
@Input()
placeholder: string;
@Input()
clearable: BooleanInput = true;
get clearableEnabled(): boolean {
return coerceBooleanProperty(this.clearable);
}
@Input()
clearValue: T = undefined;
@Input()
@HostBinding('tabindex')
tabindex: NumberInput = 0;